Przewodnik po stylach Webflow
Techbit X to nasz szablon Enterprise SaaS Webflow przeznaczony dla nowoczesnych startupów B2B. Został zaprojektowany i opracowany przez naszą certyfikowaną agencję Webflow na brixagency.com.
Kolory
Kolor akcentujący
Podstawowa 1
Podstawowa 1
#408BFC
Kolory dodatkowe
Kolor 1
Kolor 1
#EEDA29
Kolor 2
Kolor 2
#5BBEF9
Kolor 3
Kolor 3
#FF467C
Kolor 4
Kolor 4
#72D4DE
Kolor 5
Kolor 5
#D7D0C3
Kolor 6
Kolor 6
#D7D0C3
Neutralne kolory
800
Neutralny 800
#565F6F
700
Neutralny 700
#8BA0B3
600
Neutralny 600
#BDCDDC
500
Neutralny 500
#BCB5A8
400
Neutralny 400
#D7D0C3
300
Neutralny 300
#E3DFD3
200
Neutralny 200
#F8F9FA
100
Neutralny 100
#FFFFFF
Kolory systemu
400
Niebieski 400
#086CD9
300
Blue 300
#1D88FE
200
Niebieski 200
#8FC3FF
100
Niebieski 100
#EAF4FF
400
Green 400
#11845B
300
Green 300
#05C168
200
Green 200
#7FDCA4
100
Green 100
#DEF2E6
400
Red 400
#DC2B2B
300
Red 300
#FF5A65
200
Red 200
#FFBEC2
100
Red 100
#FFEFF0
400
Orange 400
#D5691B
300
Orange 300
#FF9E2C
200
Orange 200
#FFD19B
100
Orange 100
#FFF3E4
Typografia
Nagłówki specjalne
Wyświetlacz 1
Zwykły nagłówek Co
54px / 1.278em
Donec etdolr odio pelle ntesqu.
Wyświetlacz 2
Zwykły nagłówek Co
38px / 1.368em
Donec et odio lom pellen tesqu diam.
Wyświetlacz 3
Zwykły nagłówek Co
34px / 1.353em
Donec et odio pellen tesqu diam lorem ipsum dolor.
Wyświetlacz 4
Zwykły nagłówek Co
26px / 1.308em
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong.
Nagłówki
Nagłówek H1
Zwykły nagłówek Co
54px / 1.222em
Donec et odio dolor pelle ntesqu.
Donec et odio dolor pelle ntesqu.
Nagłówek H2
Zwykły nagłówek Co
38px / 1.316em
Donec et odio pellen tesqu diam lorem ipsum dolor consectur
Donec et odio pellen tesqu diam lorem ipsum dolor consectur
Nagłówek H3
Zwykły nagłówek Co
22px / 1.455em
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong dolor sit amet consec.
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong dolor sit amet consec.
Nagłówek H4
Zwykły nagłówek Co
20px / 1.3em
Donec et odio pellentesqu diam lorem ipsum dolor
Donec et odio pellentesqu diam lorem ipsum dolor
Nagłówek H5
Zwykły nagłówek Co
16px / 1.375em
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong.
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong.
Nagłówek H6
Zwykły nagłówek Co
14px / 1.429em
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong.
Donec et odio pellentesqu diam lorem ipsum dolor consectur drakong.
Ciało
Duży korpus
Zwykły nagłówek Co
20px / 1.6em
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursu.
Body Default
Zwykły nagłówek Co
16px / 1.75em
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Body Small
Zwykły nagłówek Co
12px / 1.833em
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et.
Pojedynczy tekst
400
Inter Regular
Inter Medium
Inter Bold
22px / 1.091em
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
300
Inter Regular
Inter Medium
Inter Bold
18px / 1.111em
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
200
Inter Regular
Inter Medium
Inter Bold
16px / 1.125em
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
100
Inter Regular
Inter Medium
Inter Bold
14px / 1.143em
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur
Bogaty tekst
Pogrubienie tekstu
Inter
Lorem ipsum dolor sit amet consectetur
Link tekstowy
Inter
Lista wypunktowana
Inter
- Lorem ipsum dolor sit amet consectetur
- To, co jest dla mnie ważne, nie ma znaczenia.
- Mauris aliquet faucibus iaculis dui vitae ullamco
Lista numerowana
Inter
- Lorem ipsum dolor sit amet consectetur
- To, co jest dla mnie ważne, nie ma znaczenia.
- Mauris aliquet faucibus iaculis dui vitae ullamco
Blockquote
Inter
18px / 1.667em
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
Obraz i podpis
Tekst pisany wielkimi literami
Inter
Lorem ipsum dolor sit amet consectetur
Przekreślenie tekstu
Inter
Lorem ipsum dolor sit amet consectetur
Podkreślenie tekstu
Inter
Lorem ipsum dolor sit amet consectetur
Cienie
Ogólne cienie
Shadow 01
Shadow 02
Shadow 03
Shadow 04
Shadow 05
Shadow 06
Cienie przycisków
Przyciski
Przyciski główne
Przyciski dodatkowe
Podstawowe przyciski kołowe
Przyciski drugiego okręgu
Przyciski pobierania aplikacji
Odznaki
Podstawowe odznaki
Odznaki dodatkowe
Wejścia
Wprowadzany tekst
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Obszar tekstowy
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Pola wyboru
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Przyciski radiowe
Dziękuję! Twoje zgłoszenie zostało odebrane!
Ups! Coś poszło nie tak podczas przesyłania formularza.
Awatary
Krąg awatarów
Ikony
Ikony
Ikony okręgu
