Style Guide
This style guide serves as a page that outlines clear visuals on typography, color schemes and other design elements.
Aa
Warning: The use statement with non-compound name 'CoreFrameworkHelper' has no effect in /home/srv109058/domains/mojeprzedszkole.waw.pl/public_html/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 4
Helper class does not exist.
Colors
Warning: The use statement with non-compound name 'CoreFrameworkHelper' has no effect in /home/srv109058/domains/mojeprzedszkole.waw.pl/public_html/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 3
Helper class does not exist or Core Framework plugin is not active.
Colors
Warning: The use statement with non-compound name 'CoreFrameworkHelper' has no effect in /home/srv109058/domains/mojeprzedszkole.waw.pl/public_html/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 4
Helper class does not exist or Core Framework plugin is not active.
Colors
Warning: The use statement with non-compound name 'CoreFrameworkHelper' has no effect in /home/srv109058/domains/mojeprzedszkole.waw.pl/public_html/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 4
Helper class does not exist or Core Framework plugin is not active.
Typography
Body Font: Something
.text-4xl
.text-3xl
.text-2xl
.text-xl
.text-l
.text-m
.text-s
.text-xs
.font-100 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-200 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-300 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-400 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-500 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-600 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-700 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-800 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
.font-900 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Header Font: Something
Header 1
Header 2
Header 3
Header 4
Header 5
Header 6
This is a hyperlink
Elements
Icons
.icon
Avatars
.avatar
Card
.card
Card Heading Here
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.
Sizing
.space-4xl
.space-3xl
.space-2xl
.space-xl
.space-l
.space-m
.space-s
.space-xs
.space-2xs
.space-3xs
.space-4xs
.padding-4xl
.padding-3xl
.padding-2xl
.padding-xl
.padding-l
.padding-m
.padding-s
.padding-xs
.padding-2xs
.padding-3xs
.padding-4xs
Style Guide
Discover The Best Products
Selling the best products in beauty. Rated number 1 worldwide and still growing.
Our Great Reviews from Awesome Customers
Natural ingredients, a real difference in skin.
The next generation of hydration
Shop FagarDermatologist Approved
Discover our amazing products and unleash freshness in your skin
Rated by many
This design set was brought to you by the awesome guys at Core Framework.
Links
Text linkText linkText linkText link
Links
Text linkText linkText linkText link
Links
Text linkText linkText linkText link
Copyright © 2024
Accessibility Table
Legend:
AA Passes WCAG AA (Contrast Ratio >= 4.5)
AAA Passes WCAG AAA (Contrast Ratio >= 7)
AA Large Passes for Large Text Only (Contrast Ratio >= 3)
DNP Does Not Pass (Contrast Ratio < 3)
Text Color
Background Color
Warning: The use statement with non-compound name 'CoreFrameworkHelper' has no effect in /home/srv109058/domains/mojeprzedszkole.waw.pl/public_html/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 4
Core Framework plugin is not active or Helper class does not exist.