Aviva Front-end Framework

Aviva's UX, design and front-end atomic element library

Continue to read more about the framework

Global experience principles

Find out all about how it should work, UX and Design principles to apply to experiences using the front-end framework

Check out the principles

Element library

Our atomic design element libraries: currently available templates, organism, molecules, atoms… Guidelines and examples: they're all here

Use the elements

How to guides

Building a website with the front-end framework? Here's how to use it and how to add / edit elements

Find out how

Latest updates


Call us panel

Contact panel organism to contain telephone numbers, opening times and more.


Stand-alone global navigation

Stand-alone version of global navigation including, masthead, footer, cookie policy, country selection for use with sites that do not use the front-end framework or are still using a beta version. Has been tested for compatibility with previous Framework versions.


Date range

Date range component can now be set to not allow the same day to be selected for the start and end dates, automatically set the end date on start date selection and update settings after initial load.

View the full release log

Stay up-to-date

Sign up to our email alerts about new releases to the front-end framework and CDN