← brand kit / wordmark
Icon plus “pilla”, set in Nunito 600 lowercase. The wordmark is a sibling to the icon — never a replacement. Use the icon alone where space is tight; use the lockup where the brand needs to introduce itself.
// primary lockup
// specification
-0.035em#283343 Ink — never coloured to match a ring0.28× the icon size, between icon and the ‘p’family=Nunito:wght@600 via Google Fonts// on surfaces
On white
Default. Wordmark in Ink, icon full colour.
On Ink
Icon stays full colour; wordmark inverts to white.
Mono — one ink
For embroidery, foil, fax-grade reproduction. Both icon and word in the same colour.
Mono white
On dark surfaces — photography, ink backgrounds.
// minimum sizes
Below 24px, the three rings start to blur into a single mass. At and below 20px, drop the wordmark and use the icon alone (mono variant works best at small sizes).
// don’t
Don't capitalise
It's "pilla", lowercase, always. The lowercase 'p' bowl matches the icon's roundness; an uppercase 'P' rises past the icon and breaks the lockup.
Don't go heavier than 600
800/900 outweighs the icon's airy 80-unit stroke. The wordmark stops composing with the mark and starts overpowering it.
Don't recolour the wordmark
The word stays in Ink (or white on dark, or the single mono ink). Never a ring colour — it competes with the icon.
Don't use Inter for the wordmark
Inter is for product UI and body copy. Setting the wordmark in Inter makes the brand look like a UI label, not a brand.
Don't stack vertically
Icon-above-word breaks the rhythm. The lockup is always horizontal, word-right.
Don't add a tagline inside the lockup
Taglines live in body copy near the lockup, never welded to it. Keeps the mark portable.
// files
pilla-wordmark.svg
Vector lockup · full colour · transparent. Imports Nunito 600 from Google Fonts.
pilla-wordmark-mono-black.svg
One-ink black for embroidery, foil, fax.
pilla-wordmark-mono-white.svg
One-ink white — for placement on Ink or photography.
pilla-wordmark-mono-green.svg
Brand-mint mono. Use sparingly.
// inline lockup — copy / paste
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap" rel="stylesheet">
<span style="display: inline-flex; align-items: center; gap: 0.28em;">
<svg viewBox="0 0 1024 1024" width="1em" height="1em" aria-hidden="true">
<circle cx="512" cy="512" r="380" fill="none" stroke="#3FB683" stroke-width="80"/>
<circle cx="512" cy="512" r="260" fill="none" stroke="#EC8A35" stroke-width="80"/>
<circle cx="512" cy="512" r="140" fill="none" stroke="#DD5E72" stroke-width="80"/>
</svg>
<span style="font: 600 1em/1 Nunito, sans-serif; letter-spacing: -0.035em; color: #283343;">pilla</span>
</span>Cookies
We use cookies to understand how Pilla gets used so we can improve it. Accept to help us out, or decline and we'll keep only anonymous, aggregate stats. Nothing you type is ever recorded. See our Privacy Policy.