Brand guide
The mark, colors, minimum size, clear space and what not to do. Assets download from here too.
To pass this to an AI — hand over the
/developers/brief
address instead of this page. Colors, the original mark, button code and don'ts are all in one text document,
so you can paste it as-is with no file attachments.
(Download as a .md file)
Mark
nolaa-mark.svg · 112px
놀아 Account
Minimum size
The minimum display size of the mark is 16px. At 20px or below, use nolaa-mark-sm.svg (right), which has a thicker border, instead of nolaa-mark.svg (left) — it is much crisper at small sizes.
Default
sm
16px
Default
sm
20px
The 16px and 20px cells show nolaa-mark.svg (default) and nolaa-mark-sm.svg (sm) side by side for comparison. From 24px up, use the default mark as it is.
Clear space
Keep at least 25% of the mark's height clear around the mark. No other UI element (text, buttons, borders and so on) may enter this space.
Dashed line = clear space boundary (for a 96px mark, 24px = 96 × 0.25)
Colors
Don'ts
Changing the colors
Don't use other colors in place of ink and vermilion.
Distorting or rotating
Don't change the aspect ratio or rotate the mark arbitrarily.
Removing the border
Don't use the mark without the white badge and the ink border.
Adding shadows or glow
Don't add shadows or glow effects.
Repositioning the stroke or seal
Don't move the brush stroke or the seal to a different position.
Placing it on a busy photo
Don't place it directly on a busy photo or pattern. Put it on a contrasting solid background.
Inserting it into a sentence like a letter
Don't shrink the mark to text size and set it inside a sentence.
To sign in, press the 놀아 button.
Downloads
Download all brand assets (ZIP)
For the sign-in button markup and CSS, see Build the sign-in button.