Adrianna Hirsz - wykorzystaj moc onlajnu

Style Strony

Ta strona przedstawia aktualne style i standardy witryny Adrianna Hirsz - wykorzystaj moc onlajnu.

Kolory

Przegląd kolorów marki tej witryny.
action
Action
Ultra Light
Light
Medium
Dark
Ultra Dark
Comp
primary
Primary
Ultra Light
Light
Medium
Dark
Ultra Dark
Comp
secondary
Secondary
Ultra Light
Light
Medium
Dark
Ultra Dark
Comp
accent
Accent
Ultra Light
Light
Medium
Dark
Ultra Dark
Comp
base
Base
Ultra Light
Light
Medium
Dark
Ultra Dark
Comp
shade
Shade
Ultra Light
Light
Medium
Dark
Ultra Dark
primary
Trans 10
Trans 20
Trans 40
Trans 60
Trans 80
Trans 90
secondary
Trans 10
Trans 20
Trans 40
Trans 60
Trans 80
Trans 90
accent
Trans 10
Trans 20
Trans 40
Trans 60
Trans 80
Trans 90
base
Trans 10
Trans 20
Trans 40
Trans 60
Trans 80
Trans 90
shade
Trans 10
Trans 20
Trans 40
Trans 60
Trans 80
Trans 90

Typografia

Poniżej znajduje się przegląd responsywnych rozmiarów i grubości typografii dla tej witryny. Są one obliczane na podstawie rozmiaru podstawowego i skali matematycznej.
Nagłówki
H1 (--xxl)

Heading 1 Regular

Heading 1 Medium

Heading 1 Bold

H2 (--xl)

Heading 2 Regular

Heading 2 Medium

Heading 2 Bold

H3 (--l)

Heading 3 Regular

Heading  Medium

Heading 3 Bold

H4 (--m)

Heading 4 Regular

Heading 4 Medium

Heading 4 Bold

H5 (--s)
Heading 5 Regular
Heading  Medium
Heading 5 Bold
H6 (--xs)
Heading 6 Regular
Heading 6 Medium
Heading 6 Bold
Tekst strony
BODY TEXT (--m)
Text m Regular
Text m Medium
Text m Bold
SMALL TEXT (--s)
Text s Regular
Text s Medium
Text s Bold
XTRA SMALL TEXT (--xs)
Text xs Regular
Text xs Medium
Text xs Bold
Przykłądy

Heading 1 (H1)

This is large text. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Heading 2 (H2)

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Heading 3 (H3)

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Heading 4 (H4)

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Heading 5 (H5)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Heading 6 (H6)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Przyciski

Przyciski pełne i outline są dostępne we wszystkich zestawach kolorów, w tym w czerni i bieli.
SKALA PRZYCISKÓW
Button XS
btn--primary / btn--xs
Button S
btn--primary / btn--s
Button M
btn--primary / btn--m
Button L
btn--primary / btn--l
Button XL
btn--primary / btn--xl
Button XXL
btn--primary / btn--xxl

Szerokości

Istnieje sześć wartości, których można użyć do kontrolowania szerokości elementu. Są one automatycznie responsywne
--width-xs
--width-s
--width-m
--width-l
--width-xl
--width-xxl

Padding sekcji (wewnętrzny odstęp)

Wewnętrzny odstęp sekcji jest responsywny i oparty na mnożniku układu odstępu
Brak
XS
S
M
L
XL
XXL

Odstęp

Istnieje sześć poziomów odstępów responsywnych obliczonych na podstawie rozmiaru podstawowego i skali matematycznej. Dzięki temu marginesy, dopełnienie i odstępy są idealnie dopasowane.
--space-xs
--space-s
--space-m
--space-l
--space-xl
--space-xxl

Padding elementów (odstęp wewnętrzny)

Oto sześć poziomów odstępów wewnętrznych dla elementów

Card

This is a card with XS padding. Its content is pretty close to the edges.

Card

This is a card with S padding. It has a little bit tighter padding.

Card

This is a card with M padding. It has standard breathing room.

Card

This is a card with L padding. It has extra breathing room.

Card

This is a card with XL padding. It has significant breathing room.

Card

This is a card with XXL padding. Avoid using this in a confined space.

Cienie

Do wyboru są trzy wielowarstwowe cienie elementów
Box shadow M
Box shadow L
Box shadow XL

Zaokrąglenie obramowania

Istnieje sześć wartości promienia obramowania obliczonych na podstawie rozmiaru podstawowego i skali matematycznej.
Rounded XS
Rounded S
Rounded M
Rounded L
Rounded XL
Rounded XXL
crosschevron-down