Brand guidelines

Everything below is rendered from the same design tokens and components the rest of the site uses. Change a token in src/styles/theme.css and this page changes with it.

Colors

Ink
#201d1d
--color-ink
Muted
#6d6d6d
--color-muted
Line
#dedede
--color-line
Card
#f0f0f0
--color-card
Card alt
#fbfbfb
--color-card-alt
Stroke
#8f8f8f
--color-stroke
Stroke strong
#5d5d5d
--color-stroke-strong
Icon
#2f2f2f
--color-icon
Pricing
#eaeaea
--color-pricing
Background
#f4f4f4
--color-background
White
#ffffff
--color-white

Typography

Aa
General Sans · Inter Tight

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890

Heading 1

The quick brown fox

var(--size-h1)
Heading 2

The quick brown fox

var(--size-h2)
Heading 3

The quick brown fox

var(--size-h3)
Heading 4

The quick brown fox

var(--size-h4)
Heading 5
The quick brown fox
var(--size-h5)
Heading 6
The quick brown fox
var(--size-h6)
Body

Body copy runs at var(--size-body-lg) withvar(--leading-xl) line height, and steps down on narrow screens without any breakpoint classes in the markup.

Counter

+
40+
Years Experience
$
.
B
$2.3B
Assets managed

Form controls

Icons

Drop any file into src/icons and render it with<Icon name="file-name" />. Icons inheritcurrentColor.

arrow-right-double
arrow-up-double
arrow-up-right
chevron-down
plus
check
mail
chat
support
target
facebook
instagram
linkedin
threads

Let's start talking

Have a business in mind? Just let us know.