Krafter+UF
Divi 5 Design System v2.4
text
Heading 1
Heading 1 light
Heading 1 Pri 500
Heading 1 Sec 500
Text H1
Text H2
Text H3
Text H4
Text H5
Text H6
Text H1 light
Text H2 light
Text H3 light
Text H4 light
Text H5 light
Text H6 light
Text H1 Pri 500
Text H2 Pri 500
Text H3 Pri 500
Text H4 Pri 500
Text H5 Pri 500
Text H6 Pri 500
Text H1 Sec 500
Text H2 Sec 500
Text H3 Sec 500
Text H4 Sec 500
Text H5 Sec 500
Text H6 Sec 500
Label
Label light
Label Pri 500
Label Sec 500
Text Body XS – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body XS Light – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body S – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body S Light – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body Light – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body L – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body L Light – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body XL – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
Text Body XL Light – Praesent dapibus neque id cursus faucibus tortor neque egestas auguae eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi tincidunt quis accumsan porttitor facilisis luctus metus.
- Unordered List:
- Aliquam tincidunt mauris eu risus.
- Vestibulum auctor dapibus neque.
- Nunc dignissim risus id metus.
- Cras ornare tristique elit.
- Unordered List Light:
- Aliquam tincidunt mauris eu risus.
- Vestibulum auctor dapibus neque.
- Nunc dignissim risus id metus.
- Cras ornare tristique elit.
Blockquote:
Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam gravida non commodo a sodales sit amet nisi.
Blockquote Sec 500:
Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam gravida non commodo a sodales sit amet nisi.
Blockquote Light:
Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam gravida non commodo a sodales sit amet nisi.
Text Heading in 6XL is not always a good idea!
Text Heading in 6XL is not always a good idea!
Text Heading in 6XL is not always a good idea!
Text Heading in 6XL is not always a good idea!
Text Heading in 5XL is a little bit better!
Text Heading in 5XL is a little bit better!
Text Heading in 5XL is a little bit better!
Text Heading in 5XL is a little bit better!
Text Heading in 4XL looks excellent!
Text Heading in 4XL looks excellent!
Text Heading in 4XL looks excellent!
Text Heading in 4XL looks excellent!
Text Heading in 3XL maybe the regular choice!
Text Heading in 3XL maybe the regular choice!
Text Heading in 3XL maybe the regular choice!
Text Heading in 3XL maybe the regular choice!
buttons
primary color
pri 100
pri 200
pri 300
pri 400
pri 500
pri 600
pri 700
pri 800
pri 900
secondary color
sec 100
sec 200
sec 300
sec 400
sec 500
sec 600
sec 700
sec 800
sec 900
SEMANTIC colors
sec 100
sec 200
sec 300
sec 400
Gray
gray 50
gray 100
gray 200
gray 300
gray 400
gray 500
gray 600
gray 700
gray 800
gray 900
borders
border 0
border 1
border 2
Icons
Shadows
shadow xs
shadow small
shadow medium
shadow large
padding
padding xs
padding s
padding m
padding l
padding xl
padding top xs
padding top s
padding top m
padding top l
padding top xl
margin
margin top xs
margin top s
margin top m
margin top l
margin top xl
margin bottom xs
margin bottom s
margin bottom m
margin bottom l
margin bottom xl
.
ALERTS
Notice: Morbi in sem quis dui placerat ornare. Pellentesque odio nisi euismod in pharetra a ultricies in diam. Sed arcu. Cras consequat.
Success: Morbi in sem quis dui placerat ornare. Pellentesque odio nisi euismod in pharetra a ultricies in diam. Sed arcu. Cras consequat.
Warning: Morbi in sem quis dui placerat ornare. Pellentesque odio nisi euismod in pharetra a ultricies in diam. Sed arcu. Cras consequat.
Warning: Morbi in sem quis dui placerat ornare. Pellentesque odio nisi euismod in pharetra a ultricies in diam. Sed arcu. Cras consequat.
boarder radius
radius 0
radius m
radius xs
radius l
radius s
radius xl
boarder radius



rows
text row
wide text row
content row
wide content row

section small
section m
section l
section xl
section FULL