Brand guidelines and asset kit. Everything a web team needs to build Comet & Kiln online and keep it looking like itself.
A bean, falling like a comet.
Roasting happens at night in Marfa, under the darkest skies in Texas. The mark is a coffee bean streaking in like a comet, with three trails and the first star out. Four lockups cover every space; use the primary wherever it fits.
Night sky, kiln fire.
Six colors from the place: the Marfa night, the red clay of the kiln, sun-bleached cream, desert gold and Chihuahuan sage. Tap a swatch to copy its HEX.
Approved pairings
Contrast is measured live against WCAG 2.2. Body text needs 4.5:1 (AA); large headlines need 3:1.
Loud, then warm.
Bricolage Grotesque does the shouting in heavy caps and tight headlines. Young Serif brings the warmth, one word at a time. DM Mono labels things like a roast log. All three are free on Google Fonts.
Every line above is editable. Type your own copy to test it.
Four patterns, one sky.
For packaging, backgrounds, sleeves and social. Each one tiles seamlessly. Build your own in the playground and download it as an SVG.
Drawn with one pen.
A small custom set on a 24px grid. Round caps, 1.75px strokes, no fills, and one spark where it earns it.
Shot after sundown.
Real light, real grain, real desert. Warm work lights against blue dusk; long shadows at golden hour; the night sky as big as it actually is.
The roast · warm vs. blue
The cup · golden hour
The sky · the brand's ceilingDo
- Shoot in natural or practical light; let it get dark.
- Leave grain, dust and steam in.
- Show hands, tools and the place.
- Keep a horizon or a sky in wide shots.
Don't
- No flat white studio backgrounds.
- No HDR, glow or heavy filters.
- No latte-art close-ups on marble.
- Never put the logo over a busy part of a photo.
These sample photographs are AI-generated renderings, used to show the direction.
How it shows up.
The system on the things people actually hold: the bag, the cup, the card, the post.
Try it on the website.
Pick an approved pairing and watch a homepage re-theme with it, then copy the tokens straight into the build. Every theme passes AA contrast for body text.
Roasted under the stars.
Small-batch coffee from the high desert, roasted after sundown and shipped the next morning.
Shop this week's roastThe kit, ready to build with.
Everything above, as files. It's built right here in your browser; nothing is uploaded anywhere.
Logo suite
Every lockup in three color versions, as SVG.
- primary · stacked · mark · badge
- night · cream · kiln
Color & type tokens
Drop-in variables for the web team.
- colors.css · tokens.json
- tailwind.config.js
Everything
Logos, tokens, all four patterns and a one-page README of the rules.
- /logos · /patterns · /tokens
- README.txt