Skip to content

Art Deco

Symmetrical geometry, decorative lettering, and stepped forms.

A contemporary view of the 1925 Paris Exposition des Arts Décoratifs grounds and pavilions.
Exposition internationale des arts décoratifs et industriels modernesFrench government, Paris · 1925
A white Streamline Moderne building with curved corners, horizontal banding, and nautical railings.
Streamline ModerneInternational, after the 1933 Chicago fair · 1930s to 1940s
The stainless-steel sunburst crown of the Chrysler Building against a clear sky.
Chrysler BuildingWilliam Van Alen · 1930

How it works

D
Sunburst on the axis

Gold rays, a central axis, and strict symmetry.

The motif kit

Chevron, zigzag, fan, and stepped pyramid.

EST. 1925DECOSTYLE MODERNE
Machine-age lettering

Tall capitals, wide tracking, and gold rules.

Palette
Onyx
Ivory Cream
Deco Gold
Antique Brass
Emerald
Sapphire
Oxblood
Chrome
Display faces
Poiret OneDisplay only
LimelightDisplay only
MegrimDisplay only
Josefin SansDisplay only

Use it

Figma
A radiating sunburst motif
  1. Draw one thin tall triangle or rectangle as a single ray, anchored at the center point.
  2. Select it and use Rotate copies: duplicate and rotate by a fixed angle (e.g. 15 degrees) around the shared center until the rays complete a fan or full circle.
  3. Alternate ray widths or colors (gold and onyx) for the classic high-contrast burst.
  4. Mask the rays to a circle or a stepped arch to frame the motif.

A conic or angular gradient can fake a sunburst quickly, but discrete rotated rays give the crisp, faceted edges Deco actually wants.

A stepped, geometric border frame
  1. Build the frame with Auto Layout so the border scales with the content.
  2. Construct stepped corners from stacked rectangles of decreasing size, or a chevron rule from a repeated triangle component.
  3. Stroke in gold or brass on an onyx ground; keep the stroke weight consistent.
  4. Add a thin inner hairline rule offset from the main border for the layered, engraved look.

Make the chevron or step a Component and use Instances along the border so the rhythm stays perfectly even.

Black-and-gold palette with a metallic sheen
  1. Create Color Variables: an onyx ground, an ivory air, a deco gold, and one or two jewel tones held in reserve.
  2. For gold elements, apply a linear gradient running from a darker brass through bright gold to a pale highlight, angled consistently across the page, to read as polished metal.
  3. Reserve the gold gradient for accents (rules, icons, type highlights), not large fills.
  4. Keep jewel tones as deep flat blocks behind the metal so the gold pops.

Angle every metallic gradient the same way (e.g. top-left light source) so the whole page looks lit from one direction.

Tall Deco display lettering
  1. Add a free Deco display face (Poiret One or Limelight) as a Text Style for display only.
  2. Set it in all caps and add wide letter-spacing, roughly 0.1 to 0.2em.
  3. Scale it tall and narrow; condense the type or stack it vertically for skyscraper verticality.
  4. Pair it with a quiet geometric sans (e.g. Josefin Sans) for body and UI text.

Center the lettering on the page's vertical axis and rule a thin gold line above and below; Deco type rarely stands alone without a frame.