Sharing to Stories

Sharing your content as a Facebook Story.

With Sharing to Stories, you can allow your app's users to share your content as a Facebook Story.

Overview

By using Android Implicit Intents and iOS Custom URL Schemes, your app can pass photos, videos, and stickers to the Facebook app. The Facebook app will receive this content and load it in the Story Composer so the user can publish it to their Facebook Stories.

The Facebook app's Story Composer is comprised of a background layer and a sticker layer.

Background Layer

The background layer fills the screen and you can customize it with a photo, video, solid color, or color gradient.

Sticker Layer

The optional sticker layer can contain an image, text, or both, and can be further customized by the user within the Story Composer.


Get Started

Before implementing sharing to Stories, review our Facebook Platform Terms and Developer Policies.

Design Principles

Focus on what people want to share

Your design should be straightforward and match the user’s expectations. It should be free of competing visual elements that may seem tappable or interactive. Content should be transparent and accurate to the viewing experience.

Value the stories experience

Consider the overarching story experience while creating your visual style. Remember that people only have about 5 seconds to view a story. Bring the most essential information to the forefront and reduce distractions.

Strive for clarity

Design with simplicity in mind. The focal point of your story should be the media that the user wants to share. Content should be minimal and complement the visual element in a relevant way.

Design Guidelines

Canvas

Start your project with our standard story's canvas, which you can find here.



Safe Area

Be mindful of users with smaller devices (Androids or iPhone 8 and older). Reserve the top and bottom of your story for the Facebook Stories UI.



Layering Elements

Your design should be informational rather than interactive. Designing a simple visual experience ensures that users can focus on the shared media itself.

Avoid using elements that resemble call-to action buttons (CTAs) or other UI components that users cannot interact with.



Context

It’s important to consider where the user is while viewing the story. Aim to keep additional content to a minimum. Content should be contextually relevant and supplement the shared media.

Avoid adding unnecessary or inaccurate context. This may include stating that a video is playing when the image is static.



Accessibility: Color and Contrast

Use a clean and minimalist background to ensure the focus is on the media being shared.

The Web Content Accessibility Guidelines recommend a color contrast of 4.5:1 for text and 3:1 for headings or graphics.

All designs should follow the Web Content Accessibility Guidelines.



Accessibility: Text

Differentiate text from the background by using the appropriate color contrast principles.

The Web Content Accessibility Guidelines recommend a color contrast of 4.5:1 for text and 3:1 for headings or graphics.

All designs should follow the Web Content Accessibility Guidelines.



Design System

Infuse your design with your company’s brand! Clearly differentiate your design by avoiding elements or colors that resemble Facebook’s brand.



Other Recommendations

Logo and Container

When possible, make sure your logo is located in one main container and use rounded corners on the container. Both of these will unify your design and make it more appealing.




Sharing to Instagram Stories

You can also allow your app's users to share your content as an Instagram Story. To learn how to do this, refer to our Instagram Sharing to Stories documentation.