Branding & Design system

Ofiko Brand Kit

Vypadat draze, fungovat rychle, prodávat bez keců. Styl: clean, hodně prostoru, jemné gradienty, žádný vizuální chaos.

Otevřít paletu Chci konzultaci

modernídůvěryhodnýtechnologickýprémiovýne korporát

Logo (SVG)

/logo.svg

Logo (PNG)

/my.png

Základní DNA značky

Klid, jistota, „tihle ví, co dělají“

Kdo jsme

Ofiko = moderní, důvěryhodný, technologický, prémiový, ale ne korporát.

Cíl

Vypadat draze, fungovat rychle, prodávat bez keců.

Styl

Clean, hodně prostoru, jemné gradienty, žádný vizuální chaos.

Barevná paleta (core)

Klikni na HEX/gradient a zkopíruje se do schránky.

Ofiko Purple (Primary)

CTA, aktivní prvky, odkazy, highlight textu

Ofiko Blue Accent

ikonky, linky, sekundární zvýraznění

Text – primární

nadpisy, hlavní text

Text – sekundární

popisky, doprovodné texty

Background hlavní

pozadí stránky

Cards / boxy

karty, sekce, boxy

Border / divider

děliče, okraje

Gradient (kopírování)

Zakázané pravidlo

Nepoužívat čistě černou (#000)
Vždy „soft“ odstíny (žádný tvrdý kontrast)
Nevytvářet nový random akcent mimo Purple/Blue

Typografie

Inter všude. Text musí dýchat.

Font

Inter (fallback: system-ui, sans-serif)

H1 / Hero

ExtraBold/Bold, velké, klidně přes 2 řádky

H2 / Sekce

Bold

Text

Regular/Medium, vysoký line-height

CTA

Medium/SemiBold, jasná akce, bez omáčky

Ukázka hierarchie

Luxusní design + výkon + SEO

Body

Krátce. Jasně. Bez omáčky. Vizuál má působit draze a přitom být rychlý.

UI styl

Karty, tlačítka, stíny: soft premium.

Cards

Radius 12–16px, jemný stín, hodně paddingu, žádný vizuální chaos.

Shadow

0 10px 30px rgba(15,23,42,0.08) (jemný, rozmazaný).

Buttons – Primary

Gradient Purple→Blue, bílé písmo, radius 12px, ikonka šipka/chevron.

Buttons – Secondary

Bílý background, border #E5EAF2, tmavý text, jemný hover.

Icons

Outline/line styl (Lucide vibe). Ikony jsou podpůrné, ne dominantní.

Layout

Hodně whitespace, max-width 1100–1200px, centrované, symetrické.

Tone of voice

Sebevědomě. Krátce. Bez omáčky.

✅ Správně

Moderní weby, které opravdu vydělávají
Luxusní design + výkon + SEO
Rychlé dodání. Čistý výsledek.

❌ Špatně

Jsme mladý dynamický tým, který nabízí komplexní řešení…
Nejlepší služby na trhu pro všechny segmenty…

Pravidla textu

Krátké, sebevědomé věty.
Jasná hodnota bez hype.
Konkrétní výsledky: výkon, SEO, konverze.

Animace & interakce

Jemné. Důvěryhodné.

Co dělat

Jemné hover efekty (light lift, soft shadow).
Lehký fade/scale (nic skákavého).
Animace podporuje důvěru, ne show.
Respektovat prefers-reduced-motion.

Tip

Vždy respektuj prefers-reduced-motion. Hover max ~1px lift.