Privacy Settings

Use our brand,
use it well

Everything you need to put Caretta in a deck, an article, or an integration page. Take the files, keep the colors accurate, and leave the marks as they are.

Download assetsSVG · logo + wordmark · 7 KB
Logo

The symbol

A caretta shell, drawn as one closed form. It carries the brand on its own — use it for avatars, app icons, and anywhere the name is already nearby.

Caretta lime on dark green
Lime on dark greenSVG

Primary. Use this wherever the background is dark.

Caretta dark green on lime
Dark green on limeSVG

Primary. Our most recognizable pairing — favor it when you can.

Caretta black
BlackSVG

For light backgrounds where color would compete.

Caretta white
WhiteSVG

For dark backgrounds where color would compete.

Wordmark

The wordmark

Caretta set in our own letterforms. Lead with this when a reader may not know us yet — in press, partner pages, and footers.

Caretta black
BlackSVG

Default wordmark for light backgrounds.

Caretta white
WhiteSVG

Default wordmark for dark backgrounds.

Usage

Give it room

The mark is drawn to sit inside a fixed amount of space. These are the measurements it was built with — match them and it will look right anywhere.

xxHx = 3/8 H
Clearspace

Keep clear space on every side equal to 3/8of the mark's height. Nothing crosses it — not type, not a page edge, not another logo.

2095832092175662171000 x 1000 tile — mark at 56.6%
The tile

In the locked tile the mark is 583 x 566 on a 1000square — 56.6% of the height, optically centred. Don't re-crop it. Download the tile.

96 px48 px24 px min
Minimum size

Don't place the mark below 24 px on screen or 8 mm in print. The three openings close up below that.

Please don't
    Recolor either mark outside the four colorways above.
    Stretch, rotate, skew, or add shadows, gradients, or outlines.
    Place the mark on a busy photo, or on a color that leaves it hard to read.
    Rebuild the wordmark by typing “Caretta” — always use the supplied file.

Need something that isn't here — a horizontal lockup, a one-colour print version, an animated mark? Ask and we'll send it over.

kayra@caretta.so
Color

Two greens and two neutrals

Lime and dark green do the identifying. Ink and bone carry everything else. Click any value to copy it.

Lime

The brand. Reserve it for one thing per screen — the primary action, a single highlight, the mark itself. It stops working the moment it's everywhere.

Dark Green

Lime's partner. Type and icons on lime, and dark surfaces that need warmth instead of plain black.

Ink

Body copy and headlines. Softer than pure black, which reads harsh on bone.

Bone

Our page background. Warmer than white and it makes lime look less electric.

Lime, dark green, and ink are authored in OKLCH; bone is authored in hex. The other notations are exact conversions, rounded. On the web, prefer the CSS variable.

Type

Roobert

One typeface, used at two ends of its range: Light and Medium for headlines, Regular for body. We license Roobert from Displaay, so we can't include the files here.

Aa Bb Cc

Headlines run tight — negative tracking, leading near 1.0. Body copy stays at default tracking so it reads easily at length.

CarettaLight 300
CarettaRegular 400
CarettaMedium 500
CarettaSemiBold 600
License Roobert at Displaay