Brandbook

Logo

Hlavní logotyp (logo.svg) — primární verze používaná napříč webem i v navigaci

SVGlogo.svglogo_black.svglogo_white.svg

PNGlogo_1024x1024.pnglogo_transparent_1024x1024.png

Verze s podtitulem (logo_with_subtitle.svg) — pro patičky, hlavičkové papíry a místa, kde logotyp stojí samostatně bez okolního kontextu. Podtitul zvlášť je v subtitle.svg: má stejně široké plátno jako logo, takže při shodné šířce obou souborů vyjde písmo v obou stejně velké.

Písmo

Raleway SemiBold 600, verzálky

Velikost

50 z 800 jednotek šířky logotypu

Prostrkání

8 jednotek, tedy 16 % em

Barva

#666666 — var(--color-text-muted)

V souboru

převedeno do křivek, SVG na písmu nezávisí

Samostatně

subtitle.svg — jen podtitul, na stejném plátně 800 jako logo

SVGlogo_with_subtitle.svgsubtitle.svg

Alternativní verze (logo_brush.svg) — pro tištěné materiály a větší formáty

SVGlogo_brush.svglogo_brush_black.svglogo_brush_white.svg

Bílá na černé

Černá na bílé

Modrá na bílé

Pravidla užití

Ochranná zóna

Kolem logotypu nechte volno na výšku malého písmene, tedy zhruba třetinu výšky celé kresby. Do vyznačené zóny nesmí zasahovat text, obrázek ani hrana stránky.

Minimální velikost

Pod těmito rozměry se ztrácejí tenké tahy skriptu a z háčku nad č se stane skvrna. Obě varianty mají shodné minimum na šířku: podtitul je proto v polotučném řezu, aby v malém zmizel až spolu s logotypem, ne dřív než on.

Logotyp · 160 px na šířku, 1 : 1

S podtitulem · 160 px na šířku, 1 : 1

Použití	Šířka × výška	Nejtenčí tah
Samotný logotyp
Obrazovka	160 × 44 px	1,05 px
Tisk — ofset a digitál	40 × 11 mm	0,26 mm
Výšivka a sítotisk	55 × 15 mm	0,36 mm
S podtitulem
Obrazovka	160 × 58 px	1,04 px
Tisk — ofset a digitál	40 × 15 mm	0,26 mm
Výšivka a sítotisk	55 × 20 mm	0,36 mm

Zakázané použití

Nedeformovat

Šířku a výšku měňte vždy společně.

Nezkosit

Otočit logotyp lze, zkosit ne.

Neměnit barvu

Jen modrá, černá nebo bílá.

Hlídat kontrast

Na tmavém podkladu použijte bílou verzi.

Nepřidávat efekty

Žádný stín, obrys ani přechod.

Nepokládat do vzoru

Podklad musí být klidný.

QR kód

Odkaz na milocanka.cz/qr

Světlý · modrá na bílé

Tmavý · bílá na modré

Černý · černá na bílé

Barvy

Paleta tažená přímo z web/assets/style.css přes CSS proměnné.

Favicon

Kompletní balíček v web/public/favicon/, registrovaný v nuxt.config.ts. Všechny vznikají výřezem M z hlavního logotypu. Maskovatelná verze pro plochu Androidu má logotyp menší schválně — launcher ikonu ořízne do svého tvaru a zaručeně zůstane jen prostřední kruh o 80 % šířky.

SVG · škálovatelnýfavicon.svg

180 × 180apple-touch-icon.png

192 × 192android-chrome-192x192.png

512 × 512 · maskableandroid-chrome-maskable-512x512.png

150 × 150mstile-150x150.png

48 × 48favicon-48x48.png

32 × 32favicon-32x32.png

16 × 16favicon-16x16.png

Fonty

Tři role: nadpisy, tělo textu, UI a CTA. Načítá se z Google Fonts v nuxt.config.ts.

Tlačítka

Skutečné komponenty z assets/style.css — kliknutelné, ale vedou jen na ukázku.

E-mail a sdílení

Jak značka vypadá mimo web — v odesílaných e-mailech (app/templates/emails/) a v náhledu odkazu na sociálních sítích. Rastr místo SVG záměrně: e-mailoví klienti vektor nezobrazí.

Hlavička

Patička

Náhled odkazu

og-image.jpg (1200 × 630) — obrázek, který se ukáže při sdílení milocanka.cz na sociálních sítích a v chatech

JPGog-image.jpg

Reklamní předměty

Ilustrační vizualizace, ne fotografie hotových předmětů — nápis na nich je napodobenina, ne skutečný logotyp. Pro výrobu vždy použij soubor ze sekce Logo.

Luxusní pero

Sklenička na víno

Polokošile