Colours
Our color palette is essential to our brand identity. Here, we outline the primary and secondary colors used.
Brand: blue
Pallette: blue
Brand: orange
Pallette: orange
Typography
Typography is crucial to our visual identity. This section covers the typefaces we use.
Type: Signifier
Kris Sowersby, the designer behind Signifier, envisioned a typeface that could transcend trends and stand the test of time. His expertise and passion for typography are evident in Signifier's harmonious blend of beauty and functionality. Signifier comes in various weights and styles, providing designers with the flexibility to create dynamic typographic compositions. Whether used for headlines, body text, or display purposes, it maintains readability and visual appeal.
Signifier 200 Extra Light Italics
Signifier 300 Light
Signifier 400 Regular
Signifier 500 Medium
Signifier 700 Bold
Signifier 900 Black
Type: Abril Fatface
The creation of Abril Fatface was a collaborative effort by Veronika Burian and José Scaglione, co-founders of TypeTogether. Their vision was to create a typeface that could bridge the gap between historical influence and modern design needs, providing designers with a powerful tool for impactful typography. This typeface shines in display settings, making it perfect for headlines, posters, branding, and editorial design. Its bold, expressive nature ensures that any message it conveys is delivered with confidence and flair.
.1&2&3&4&5&6&7&8&9.
:1&2&3&4&5&6&7&8&9:
Headings
Headings help structure our content. This section outlines our heading styles.
Class: H1-H6
H1 to H6 headings are HTML tags that define the hierarchy and structure of content on a webpage. These headings not only improve readability and organization but also play a crucial role in SEO by helping search engines understand the structure and importance of the content.
H1 Ampers &house title
H2 Ampers& house title
H3 Ampers&house title
H4 Ampers&house heading
H5 Ampers&house heading
H6 Ampers&house heading
Class: Size & weight
Text weight and size are key elements in typography that influence readability and visual hierarchy. By varying text weight and size, designers can create contrast, direct the reader’s attention, and enhance the overall aesthetic of the design.
Extra small size of a heading text
Small size heading text
Regular size heading text
Medium heading
Large size title text
Extra big xxl title
Default light heading size
Default extra bold heading size
Default more height heading spec - serves to emphasize the importance of white space.
Paragraphs & links
Paragraphs form the body of our content. This section provides guidelines on paragraph styles.
Using the smallest paragraph size in design layout requires careful consideration to maintain readability and visual balance. While small paragraph sizes can be useful, it's crucial to ensure the text remains legible and accessible, maintaining a comfortable reading experience for all users.
Regular paragraph size is ideal for body text in articles, reports, and most web content. It provides a comfortable reading experience and is versatile enough for various types of content. Use regular size for the main information, ensuring clarity and readability.
Medium paragraph size is slightly larger than regular and can be used to emphasize key points or highlight important sections within the body text. It is perfect for short summaries, intros, or conclusions where a bit more emphasis is needed without overwhelming the reader.
Large paragraph size is suitable for subheadings, lead paragraphs, or key statements that need to draw the reader’s attention. Use it to break up long sections of text, making the content more digestible and engaging.
Extra-large paragraph size is best for headings, quotes, or very important messages that need to stand out prominently. It creates a strong visual impact and guides the reader's eye to the most critical parts of the content.
Icons
Icons add visual interest and aid navigation. This section covers our icon styles.
Labels
Labels provide quick information. This section outlines our label styles.
Label Text
Label Text
01.
Intro
01.
Meaningful catch
Label Text
Label Text
Label Text
Rich text
Rich text allows for diverse content. This section covers our rich text styles.
We're about forever.
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.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Ampers& lasting in H2.
Natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
- Duis aute irure dolor in reprehenderit in voluptate velit esse
- Excepteur sint occaecat cupidatat non proident, sunt in culpa
Heading west, stayin' in heading H3.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
- Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laborisi
- Duis aute irure dolor in reprehenderit in voluptate
- Excepteur sint occaecat cupidatat non proident, sunt in
Usually heading east leads to incorporating H4.
Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus
"Like totally abstract quote providing all the information needed"
Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.
Heading west, stayin' heading H3.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Heading stays heading until the last H5 stands.
Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.
- Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laborisi
- Duis aute irure dolor in reprehenderit in voluptate
- Excepteur sint occaecat cupidatat non proident, sunt in
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
I was Heading at you, you heading at me, both so pure H6.
Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.
I was Heading at you, you heading at me, both so pure H3.
Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.
Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.
Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.
Illustrations
Illustrations enhance our storytelling. This section outlines our illustration styles.
Forms
Forms facilitate user interaction. This section outlines our form styles.
Interaction
Interactions enhance user experience. This section covers our interaction guidelines.
Get in touch instantly
Buttons
Buttons drive actions. This section outlines our button styles.
Your submission has been received!