style guide.

Tipográfia

Real size
Variable
Min size @
320px viewport
Max size @
1360px viewport

a H1 heading - Cím

var(--h1)
2.03rem
3.42rem

Here's a h2 - Cím

var(--h2)
1.80rem
2.85.rem

Here's a H3 - Cím

var(--h3)
1.60rem
2.38rem

Here's a H4 - Cím

var(--h4)
1.42rem
1.98rem
Here's a H5 - Cím
var(--h5)
1.27rem
1.65rem
Here's a H6 - Cím
var(--h6)
1.13rem
1.38rem
.c-text-xl - 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.
var(--xl-text)
1.1rem
1.4rem
.c-text-l - 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.
var(--l-text)
1rem
1.2rem
.c-text-m - 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.
var(--m-text)
1rem
1rem
.c-text-s - 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.
var(--s-text)
0.85rem
0.85rem
.c-uppercase
.c-lowercase
.c-underline
.c-bold
.c-italic

Aa

calc(var(--h1) * 3)

Aa

calc(var(--h1) * 2)

Aa

calc(var(--h1) * 1.5)

Színek

#0026ff
.c-heading-accent
#0f0f0f
.c-heading-dark
#ffffff
.c-heading-light
#0026ff
.c-text-accent
#686868
.c-text-dark
rgba(255,255,255,0.8)
.c-text-light

Háttér

#0026ff
.c-bg-accent
#e8e9ff
.c-bg-accent-alt
#f9f9f9
.c-bg-light
#ffffff
.c-bg-light-alt
#11141e
.c-bg-dark
#181c2d
.c-bg-dark-alt

Térköz

Real size
Variable
Min space size
Max space size
XXL size
var(--xxl-space)
52px
130px
XL size
var(--xl-space)
32px
80px
L size
var(--l-space)
20px
50px
M size
var(--m-space)
12px
30px
S size
var(--s-space)
8px
20px
XS size
var(--xs-space)
4px
10px

Kártyák

Core - WebDesign.hu

Csodás WebDizájn

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Webdesign
Core - WebDesign.hu

Csodás WebDizájn

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Webdesign
Core - WebDesign.hu

Csodás WebDizájn

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
webdesign

Ikonok

magnifierchevron-down
0
    0
    Kosár
    A kosár üresVissza a boltba
      Szállítási díj kiszámítása
      Kupon érvényesítése