Angela Marie MacDougall
Global Presets UI Style Guide
01. Color palette
Your color palette contains warm shades and tones of red, brown, orange, yellow, black, and green.
The primary color palette (red and brown) are the colours that will be used in the logo. These should be used more prominently than the secondary colours.
The secondary colours are accent colours,complimenting the primary color set. As a general rule (which may be broken!!) they should not be used on their own without a primary color present.
Font colors for headlines and buttons can be any of the primary or secondary colours. Use 100% black for body text font color on a light background and 100% white for text on a dark background.
#000000
#4C2917
#ffffff
#D73827
#F47C20
#E99F22
#1e5933
#142618
02. Visuals
The second part of this style guide shares some of your brand visuals. These include icons and illustrations and are saved in your WordPress media library, ready for you to use.
03. Text styles
Your primary font is Open Sans. Use Open Sans light for your main body text and Open Sans condensed for sub headings H3, H4, and H5.
Your H1 and H2 font Montserrat makes a bold and elevated statement for headlines.
Font colors for headlines and buttons can be any of the primary or secondary colours. Use 100% black for body text font color on a light background and 100% white for text on a dark background.
Heading 1
Heading 1
Heading 2
Heading 2
Heading 3
Heading 3
Heading 3
Heading 4
Heading 4
Body
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.
All in one
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Lorum ipsum dolor sit amet.
04. Buttons
Here, you’ll find the buttons that are customized to meet your brand standards.
Button 1
Button 2
Button 3
Button 4
05. Blurbs
Up next, we have some blurb modules that are customized to meet your brand standards.
Blurb 1
Stand out list item
Blurb 2
Publications
Blurb 3
Stand out list item
Blurb 4
Nulla quis lorem ut libero malesuada.
06. Other modules
Last but not least, here are form, slider, and social media module designs that have been customized to meet your brand standards.
Email optin form 1
Contact form 1
Social media follow 1
Social media follow 2