Design system
Style Guide
Paleta granatowa inspirowana logo (czarno-granat) oraz jasne, prawie białe powierzchnie znane z dotychczasowej strony. Bazujemy na tym systemie przy budowie treści.
Kolory
Główny kolor marki to głęboki granat. Jasne tła (#FFF / #F7F9FC / #EEF2F7) zapewniają czytelność i „lekkość” znaną z poprzedniej witryny.
Granat marki
Jasne powierzchnie
Tekst
Typografia
Nagłówki: Barlow Condensed (charakter „motoryzacyjny”). Treść: Figtree (czytelna, nowoczesna).
Display · Barlow Condensed
Skup samochodów 24/7
Pomoc drogowa i holowanie
Złomowanie pojazdów
Wycena online
Body · Figtree
Szybka wycena, dojazd i rozliczenie - bez zbędnych formalności.
Kupujemy auta sprawne, uszkodzone i powypadkowe. Działamy lokalnie na Śląsku i okolicach, z możliwością transportu na terenie całej Polski.
Dostępni całą dobę
Przyciski
CTA w granacie na jasnym tle; na hero - wariant jasny / ghost.
Formularze
Pola na białym tle, delikatna ramka granatowa przy focusie.
Oddzwonimy z wyceną.
Powierzchnie i sekcje
Trzy warstwy tła: biała treść, miękkie tło strony, wyciszona sekcja. Hero zawsze w gradiencie granatu.
Hero / Brand
Gradient navy-950 → navy-700. Tekst jasny.
Surface
Białe tło pod główną treść i formularze.
Muted
Sekcje naprzemienne, listy usług, FAQ.
Page soft
Domyślne tło body - prawie białe, chłodne.
Odstępy
Skala spacing oparta o rem - od 4px do 128px.
Tokeny CSS
Najważniejsze zmienne - pełna lista w assets/css/main.css.
--color-brand: #0A1628;
--color-surface: #FFFFFF;
--color-surface-soft: #F7F9FC;
--color-surface-muted: #EEF2F7;
--font-display: "Barlow Condensed";
--font-body: "Figtree";
--container: 72rem;
--gradient-hero: navy-950 → navy-700;