Skip to main content
This is where Florence pulls away from single-chart tools. A brand kit is a regular project you mark as a brand kit. Its styles, templates, and themes become available to any project that links it — the same idea as publishing a Figma library.

​
Styles

In Assets → color styles and text styles:
  1. Create a style (font, size, line height, color, and the rest for text; a color token for fills).
  2. Apply it from the Properties panel (text style picker, color style connector).
  3. Edit the style in Assets. Linked text and colors update across the project.
Chart value labels and line labels can use the same text styles.

​
Import from Figma

The Florence Figma plugin writes a .flo file from the color variables and text styles you select. Load the plugin from figma-plugin/manifest.json in Figma desktop (Plugins → Development → Import plugin from manifest), then choose Export styles. Collections with no color variables are shown but cannot be exported.
  1. In Florence, open Assets → Colors or Text styles. Both panes use the same import control.
  2. Choose Import styles and pick the .flo file.
Folders come across. A color variable with light and dark values becomes one color style. An alias becomes a link to the other color style. Opacity stays on the color. A text style keeps its type settings. Sizes that use desktop, tablet, and mobile — or lg, md, and sm — land on those breakpoints. Import the file again after the Figma library changes. Florence updates the styles that came from that file. Styles created in the project stay. Linked projects see the change after you publish the brand kit.

​
Templates

A template is a layout: size, padding, layout, and the block tree.
  1. Build a frame you expect to reuse (headline / chart / footer is the usual one).
  2. Select the frame → Template → Save as template in the properties pane, or Assets → Templates.
  3. In any project that can see that template, click it in Assets to insert a new frame.
The new frame has the layout with lorem ipsum text and empty charts, tables, and images. Chart types carry over. Copy and data do not. If the template’s source frame had a theme, the new frame is linked to that theme too. Update brings in layout and structure changes, including block type and visibility. Text you rewrite, data you bind, and blocks you add stay. Blocks you deleted stay deleted. Reset clears local changes and brings deleted template blocks back.

​
Themes

A theme is styling only: the frame’s fill, stroke, radius, and opacity, plus the look of every block. Type per heading level and paragraph, chart colors, axes, gridlines, labels, legends, tables, images, dividers, and controls. Chart margins and plot padding come from the theme, then grow so axis titles and tick labels fit. Tick format comes from the theme too: number format, percent, decimals, prefix and suffix, and the date pattern, plus tick-label typography, size, and position. Frame size, frame padding, and frame layout stay on the template. Copy, data, and the axis range (min and max) stay on the frame.
  1. Style a frame the way you want, with the chart types you use.
  2. Theme → Save as theme in the properties pane, or Assets → Themes.
  3. On any frame, pick the theme in Theme, or click it in Assets.
Each chart type gets the look of that chart type in the theme frame. A chart type the theme frame does not have takes the shared palette, gridlines, axes, and labels from the charts that are there. A theme frame shows Publish changes and Delete theme instead of a theme picker. Editorial, Minimal, and Bold are built in.
  1. In the brand-kit project: file menu → Mark as brand kit.
  2. Publish brand kit when the draft should become the release. Linked projects read that release. They do not see later draft edits until you publish again.
  3. In a working project, a designer links the kit from Assets. Creators do not link or unlink kits.
A kit that has never been published links as empty: “This brand kit has not been published.” Linked projects pick up a publish while they are open. Each frame that uses a changed template or theme shows a violet Template or Theme heading and Update. Update can apply to this frame, or to every matching frame in this project. Reset asks first and offers the same two scopes. A theme you switched on a frame stays when you update the template.

​
How this looks in practice

A studio producing a long-running client package (the Yelp graphics we make at DataFace, for example) would:
  1. Create a Yelp brand kit project.
  2. Save Yelp red / teal as color styles, and the type hierarchy as text styles.
  3. Build the frames that get reused (header + chart + footer, small multiples, image beside chart) and save each as a template.
  4. Save “Yelp simplified” and “Yelp dense” as themes.
  5. On the next deliverable, link the kit, insert the templates, connect new datasets, and switch the theme that matches the story. Publish the kit again when the shared language should change. Open frames show Update for the template or theme that changed.
One kit, many projects, same graphic language.