BRAND // ASSETS

Use the marks.
Don't bend them.

Everything you need to add a “Sign in with Chirp” button to your app, and the rules that keep it recognizable. Full terms in TRADEMARK.md.

THE MARK

Yellow square, black C, 2px border.
mark.svg

THE WORDMARK

Chirp

Archivo Black · always one word · never “Chirp”.

COLOR TOKENS

Sunshine

#FFD60A

brand · button fill

Ink

#0a0a0a

type · borders

Card

#ffffff

surface

Cream

#f6f1e0

secondary surface

Mute

#6b6b6b

metadata only

THE “SIGN IN WITH CHIRPAUTH” BUTTON

YELLOW-ON-BLACK · DEFAULT

Most visible on arbitrary app pages. signin-yellow-on-black.svg

BLACK-ON-YELLOW · ALTERNATE

Most on-brand. signin-black-on-yellow.svg

WHITE-ON-BLACK · MONO

For dark UIs. signin-white-on-black.svg

COPY-PASTE · HTML

<a href="https://signin.chirpauth.com/authorize?client_id=…">
  <img src="signin-yellow-on-black.svg"
       alt="Sign in with Chirp" height="52">
</a>

✓ YOU CAN

Use the marks to refer to Chirp

Link to chirpauth.com

Build integrations on the OIDC API

Resize the button proportionally

✗ YOU CAN'T

Use the marks for a fork or derivative

Recolor, rotate, or restyle the mark

Imply Chirp endorses your app

Add effects, gradients, or rounded corners

Use the marks.Don't bend them.

Use the marks.
Don't bend them.