Artzy Brand Style Guide

Artzy Brand Guidelines

Sistema poster-pop para quick commerce creativo: azul dominante, crema cálido, soft ink, mascot doodle y slogans gigantes.

FUENTE: Artzy-Brand-Guidelines-DESIGN.md

Typography

Original + HTML
Heading system
Archivo
Specimen · 700 · 48px · ls -0.03em
Body system
Public Sans
400 · 16px / 24px
This is how body text feels at 18px when applied to a real paragraph block.
Original fonts · Heading: Obviously -> Archivo · Body and labels: Nimbus Sans -> Public Sans (Google substitutes).
Labels · Public Sans · 700 · 14px / 20px. La secundaria sostiene captions, utilitario y bloques de detalle.
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
01 02 03 04 05 06 07 08 09 0%

Colors

Blue-led palette
Primary#4890E0
Secondary#2A2A2A
Tertiary#F87078
Neutral#FFF8DD

Background #FFF8DD · Surface #FFFFFF / #4890E0 · Text #2A2A2A · Border #D8D0B0 · Accent #F87078 / #70F888 / #E0B030

Overview

Poster system
LayoutEditorial + poster hybrid
Content width~1080px
FramingHuge headline, short body, hero asset
Grid2-column rhythm with big planes

Buttons

3 styles
Primary#4890E0 · text #FFF8DD · 14px
Secondary#2A2A2A · text #FFF8DD · 14px

Spacing

8px base
drop now
Title block
Artzy works when the message lands fast, the blue block stays loud and the supporting details remain compact and useful.
Scale
8px12px20px32px48px88px section
Gaps · Card padding
gap 24pxpromo 20-24pxposter air 32px+

Elevation & Depth

Flat and loud

Depth is minimal. The system gets impact from flat color fields, printed texture, chunky typography and contrasting objects, not from glossy UI treatments.

TechniquePoster-flat panels, slight card rounding, product photography and mascot linework create rhythm without visual luxury effects.
Surface#FFF8DD / #4890E0 / #2A2A2A
Border1px #D8D0B0
Shadowsoft only on mockups, not on identity planes
Blur / deepNone - static brand system

Shapes

Canvas + doodle

The logo-canvas shape is angular and bold, while supporting promo cards get rounded corners. Doodles stay loose and irregular to counterbalance the geometry.

14px controls20-28px promo cardssharp logo canvasfreehand mascot
Primary radius14px
Icon set · treatmentCanvas logo plus hand-drawn mascot

Do's and Don'ts

Guardrails

Do

Lead with blue and cream before using promo accents.
Let the display headlines own the loudest moments.
Use Charial as narrative punctuation and emotional release.
Alternate flat poster sections with clean product photography.

Don't

Do not neutralize the brand into a polite stationery catalog.
Do not use all promo accents equally on one screen.
Do not polish the mascot into a sterile illustration set.
Do not replace the cream base with pure white everywhere.