Add data visualization to your project directly from Flourish to bring a whole new level of interactive content to your design.
👍🏽 Adding a Flourish Element
As an Element
From the top menu bar, click on the Add Menu (
Shortcut: M)Search for and select Flourish
Click and drag the element onto your canvas
As a Section
From the top menu bar, click on the Add Menu (
Shortcut: M)Search for and select Flourish
Press and hold the Alt (Windows) or Option (Mac) key
Click where it says Add section here
Embedding Your Flourish Project
Double-click the Flourish element
Paste your project link in the Flourish project link field
Your Flourish project will show up in the preview mode and when published.
🎨 Styling a Flourish element
Spacing top: Add padding to the top of the Flourish section in pixels or % to keep spacing between sections
Spacing bottom: Add padding to the bottom of the Flourish section in pixels or % to keep spacing between sections
Width: The width of a Flourish section can't be altered, it'll always be set to cover the 100%
Height: Set the height of the Flourish section in Pixels, % or set it to Auto so that it grows as you add content to it
Min H: Sets the minimum amount of height pixels a section can be. A red stippled horizontal line inside your section will reflect the minimum height
Clip content: Toggle to hide the content that goes beyond the section's edges
Resize to fill vertically: Click to set the section's height to 100%
Border: Set a border color, opacity, and line weight for the element's container
⚙️ Configuration options
Parameter | Description |
Flourish project link | Where you can paste your project's link |
Enable Scrollytelling | Toggle to enable a scrollytelling effect. It's mostly used when adding the element as a section (only works with Flourish stories) |