Colors

Change the color swatches of the following colors to change the whole appearance of the Mavis Template. By doing that, you can completely change the look and feel of the whole template. There are some small details like logo, icons and some other elements, that you will still need to change manually to fit the new style.

Amethyst #9966CC
Russian Violet #33194D
Pale Purple #EBE0F5
Seasehll #FEF4EC
Dark Purple #353140
Darker Purple #181123
Image Overlay #9966CC 27% Opacity

Typography

Heading sizes are optimized to look great on all devices, but you can always go in and change any value to fit your new website look. If you want to give headings their own font family, you can do that here by selecting individual heading (all pages) and change the Font property. To download the font - Click Here.

Welcome to MMHS

H1 Heading (Barlow - 700 Bold - 58px - Russian Violet) 

Welcome to MMHS

H2 Heading (Barlow - 700 Bold - 42px - Russian Violet) 

Welcome to MMHS

H3 Heading (Barlow - 600 SemiBold - 34px - Russian Violet) 

Welcome to MMHS

H4 Heading  (Barlow - 600 SemiBold - 26px - Russian Violet) 
Welcome to MMHS
H5 Heading (Barlow - 600 SemiBold - 20px - Russian Violet) 
Welcome to MMHS
H6 Heading (Barlow - 600 SemiBold - 18px - Russian Violet) 
Welcome to MMHS
Caption  (Barlow - 600 SemiBold - 13px - Russian Violet) 

Paragraphs

Here you can simply change the paragraph properties. If you want to completely change the font family for whole template, instead of changing styles here, select the Body (all pages) tag and change the Font property.

Paragraph (Barlow - 500 Medium - 17px - Russian Violet) 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Paragraph Small  (Barlow - 500 Medium - 15px - Russian Violet) 

Logos

Right click on the image and select 'Open image in new tab' to download the full resolution image.

Buttons

Simply choose the prepared buttons and insert them into sections of your choice.

Images

Images have a translucent purple overlay to match the MMHS colors. Please use the image overlay color above to replicate this effect.

Rich Text

Rich Text Element (RTE) is the perfect element for creating long-form content. It's styled accordingly with the template style.

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

Morbi placerat, enim ut dignissim suscipit, ipsum massa suscipit ante, fringilla faucibus erat nisl venenatis elit. Nunc dictum ultricies ipsum, at accumsan sapien ultricies vestibulum.

Duis pharetra congue metus, sit amet rhoncus nisi bibendum in. Phasellus et scelerisque lorem. Nam quam dui, rhoncus sed sapien quis.

Nunc tortor elit, pellentesque mattis lectus ac, tristique tincidunt tortor. Duis iaculis condimentum massa. In porttitor lectus in est tristique rhoncus. Fusce lobortis tristique dolor eu consectetur.

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.