§01 · Logo
One goat, three sizes, no redraws.
Use the horizontal lockup by default, the full Leap mark for big brand moments, and the icon for anything small. Every file below is made from the same vector paths, so take the one you need instead of tracing or recolouring it.
The three versions.
Each comes in colour for light backgrounds and reverse for dark ones, plus one-colour versions for print and embossing.
Horizontal lockup
The default sign-off: headers, footers, decks, partner pages, pressThe Leap icon, a gap, then the wordmark: "Freshly" in the text colour and "Cited" in the accent colour, set in Archivo.
PNG, transparent: 600 px · 1200 px · 2400 px (colour; every colourway and size is in the zip).
Primary mark (full Leap)
Large brand moments on light backgrounds: the about page, presentations, printA navy mountain goat leaping out of an open box toward a gold spark. Its gold horns curl into a closing quotation mark.
PNG, transparent: 600 px · 1200 px · 2400 px (colour; every colourway and size is in the zip).
Icon (goat head)
Everything small: favicons, app icons, avatars, social cards, the story-scene actorThe goat's head on a navy rounded tile: gold quote-mark horns, a paper face and a navy eye.
PNG, transparent: 64 px · 128 px · 256 px · 512 px · 1024 px · 2048 px (colour; every colourway and size is in the zip).
Colour on light, reverse on dark.
On paper, “Cited” is gold-ink #7A5F0E, because gold fails contrast there. On navy it's gold #D4AF37. The icon carries its own navy tile, so the same icon works on both: there is no reverse icon.
Give it room to leap.
Keep clear space free of text, other logos, page edges and busy imagery.
Small sizes get the icon.
Below 96 px wide, the full mark's box line and spark turn to noise. Switch to the icon, which holds up down to a 16 px favicon.
| Version | On screen | In print | Below the minimum |
|---|---|---|---|
| Primary or reverse mark | 96 px wide | 25 mm | Switch to the icon. The box line and spark turn to noise |
| Icon | 16 px (favicon) | 6 mm | Never go below 16 px |
| Icon + wordmark lockup | Icon 24 px, wordmark at 0.68× the icon | — | Use the icon alone |
Please don't improve it.
The goat is drawn once. Every change below makes it someone else's goat.
DoUse the files in this kit, or <Logo /> and <Wordmark /> in code
Don'tRedraw, trace or "clean up" the goat
DoUse the icon below 96 px
Don'tSqueeze the full mark into a favicon or a nav bar
DoUse the reverse mark on navy and dark photos
Don'tPut the navy mark on navy, or the reverse mark on paper
DoKeep gold for the horns, the quote and the spark
Don'tRecolour the goat: no gradients, no moss goat, no white tile
DoKeep the proportions locked
Don'tStretch, rotate, skew, outline or add drop shadows
DoKeep the clear space empty
Don'tPlace the mark on a busy illustration without a solid tile behind it
DoWrite "FreshlyCited" in running text
Don'tUse the logo in place of the word inside a sentence
In our own code.
On freshlycited.com and in the app, the logo is never an image you paste: it's a component that draws the real paths.
| Use | Component | What it renders |
|---|---|---|
| The icon | <Logo size={30} /> | The Leap icon from src/components/leap-icon.ts |
| Icon + name | <Wordmark size={28} /> | "Cited" takes --ip-accent: gold-ink on light, gold on dark |
| Structured data | ORG_LOGO | /brand/freshlycited-icon-512.png, 512×512, in every Organization block |
Sizes in use today: header icon 30 px (26 px once scrolled), footer and app sidebar 28 px, social cards 56 px, story scenes 28 px.
App icons and social images.
Square, full-bleed versions for places that round or crop the corners themselves.
