Skip to content

Collection 01

Hearth

Deep cards, numbers first, one accent.

Figma file · Collection 01

Hearth

100+ widgets, 11 blocks, dark and light. Every colour, type style and component lives in the file.

Open the Figma file
Widgets
100+
Blocks
11
Modes
Dark + light
Presets
Chartory + Ember

Hearth ships in every plan, in the Figma file and the registry with the charts.

The language

What makes Hearth, Hearth.

Four choices carry the whole collection. Change them and you have a new collection; keep them and every widget belongs together.

Surface

Near-black canvas, deep panels, cards one step up.

Corners

12 on widgets, 6 on chips and controls.

Type

Geist: Medium for numbers, Regular for labels.

Accent

One orange accent, only on the main action.

Inside Hearth

The widget

Header, hero number, chart and up to two of the 11 blocks in a single card. 100+ widgets, one per chart type.

Widget anatomy

Gallery

Each widget with its own blocks and its own sector data.

The Figma gallery

All 132 widgets, one Figma page

Dark and light galleries with every block and state. Open the file and check each style against your product.

Open the gallery in Figma

Every type also has its own page, with its widget.

See all 100+

In the works

The next collection is being made.

Same 100+ types, a new language, in every plan. Get an email when it opens.

One email when a collection opens. Nothing else.

  • Collection 03In the works
  • Collection 04In the works
  • Collection 05In the works