This environment is not optimized for viewing on small or mobile devices. Please view on a larger browser for the best experience.
If you have any questions, please contact us.
This environment is not optimized for viewing on small or mobile devices. Please view on a larger browser for the best experience.
If you have any questions, please contact us.
Our system is designed using a four-pixel baseline grid, which helps us maintain consistent vertical spacing. It governs the spacing between stacked elements within a component, as well as the spacing in between objects on a page.
Using denominations of four, between four and 80 pixels, there is plenty of scope for creative flexibility and use of negative space while still adhering to an underlying foundation of rules. Be sure to maintain consistency throughout the environment.
Spacing between elements within a component is 20px.
Example: In a contact form, the City and State fields are separated by 20 pixels.
Spacing between elements within a component is 24px.
Example: In a contact form, the City and State fields are separated by 24 pixels.
Between separate but related content types
Total spacing between components should be greater than 20 pixels and less than 40 pixels to maintain a distinct separation.
Example: In a contact form, the Address and Phone sections are separated by 32 pixels.
.svg)
Between separate but related content types
Total spacing between components should be greater than 20 pixels and less than 40 pixels to maintain a distinct separation.
Example: In a contact form, the Address and Phone sections are separated by 32 pixels.
.svg)
Between distinct content types
Spacing between distinct content types should be a minimum of 40 pixels. Consider using a horizontal rule to separate distinct types of content.
Example: Within a profile, the Personal Details and Contact sections are separated by 40 pixels.
.svg)
Between distinct content types
Spacing between distinct content types should be a minimum of 36 pixels. Consider using a horizontal rule to separate distinct types of content.
Example: Within a profile, the Personal Details and Contact sections are separated by 36 pixels.
Aon Consumer Experience & Design Group
200 E. Randolph St.
5th Floor
Chicago, IL 60601
global.design@aon.com
For best results, please view on Desktop in Chrome or Firefox.