Theme proof

One component set in light and dark, in the brand picked in the top bar. Each preview and its overlays keep their own theme. Components may only reference contract tokens.

youspot · light

youspot.com
YouSpotSecond brainbuilt for you
Brand kit
  • Primary
  • On primary
  • Background
  • Foreground
  • Card
  • Muted
  • Border
  • Accent
HeadingSpace Grotesk
BodyInter
Radius6px
FrauncesWork Sans

Content preview

Preview only. Your saved colors stay unchanged.

Preview appearance
Northwind Traders

Make your next move.

Bring your ideas into focus with a look that feels like you, wherever your work takes you.

Explore what's possible
Built around your ideas

A place for the details that make your brand yours.

  • Primary
  • On primary
  • Background
  • Foreground
  • Card
  • Muted
  • Border
  • Accent
HeadingFraunces
BodyWork Sans
Radius12px

Identity

Extracted

Colors

Dark modeAuto creates a dark version for dark appearances. These fields always edit your base colors.

On primary on primary: 5.5:1

Foreground on background: 17.2:1

Type and shape

Heading font
Body font
12

Logo

No logo
Logo
No logo
Logo on dark

Documents

How your PDFs are laid out. Every document you make starts from these.

Page size
Orientation
Spacing
Headings
Body
Header rule
Printed at the foot of every page. Leave it empty to use your brand name.

youspot · dark

youspot.com
YouSpotSecond brainbuilt for you
Brand kit
  • Primary
  • On primary
  • Background
  • Foreground
  • Card
  • Muted
  • Border
  • Accent
HeadingSpace Grotesk
BodyInter
Radius6px
FrauncesWork Sans

Content preview

Preview only. Your saved colors stay unchanged.

Preview appearance
Northwind Traders

Make your next move.

Bring your ideas into focus with a look that feels like you, wherever your work takes you.

Explore what's possible
Built around your ideas

A place for the details that make your brand yours.

  • Primary
  • On primary
  • Background
  • Foreground
  • Card
  • Muted
  • Border
  • Accent
HeadingFraunces
BodyWork Sans
Radius12px

Identity

Extracted

Colors

Dark modeAuto creates a dark version for dark appearances. These fields always edit your base colors.

On primary on primary: 5.5:1

Foreground on background: 17.2:1

Type and shape

Heading font
Body font
12

Logo

No logo
Logo
No logo
Logo on dark

Documents

How your PDFs are laid out. Every document you make starts from these.

Page size
Orientation
Spacing
Headings
Body
Header rule
Printed at the foot of every page. Leave it empty to use your brand name.