AMG logo white

Style Guidelines

Version 1.0 | July 2023

Global Styles

Colors

Below are primary and secondary color palettes, along with gradients and textures.

Please note WCAG 2.1 Level AA accessibility considerations when choosing any AMG brand colours for typography to ensure a compliant contrast ratio is used. WCAG 2.1 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. Normal text is defined as 16px. Large text is defined as ~18.66px and bold or larger, or ~24px or larger. WCAG rating is based on contrast with a background color of white (#FFFFFF).

To learn more about the success criteria for minimum contrast levels for text, please visit the W3C Recommendation website.

To validate color contrast levels, the online tool Color Contrast Checker can be used.

Primary Colors

Blue
HEX: #2273BA
RGB: 34/115/186
CMYK: 89/43/0/0
AA normal text*
Dark Blue
HEX: #214396
RGB: 33/67/150
CMYK: 100/90/0/0
AAA normal text*
Black
HEX: #221F1F
RGB: 34/31/31
CMYK: 0/9/9/87
Dark Grey
HEX: #6F6F6F
RGB: 111/111/111
CMYK: 0/0/0/56
Medium Grey
HEX: #D3D4D9
RGB: 211/212/217
CMYK: 3/2/0/15
Light Blue/Grey
HEX: #F8F8FA
RGB: 248/248/250
CMYK: 1/1/0/2
White
HEX: #FFFFFF
RGB: 255/255/255

Secondary Colors

Green
HEX: #B0BE36
RGB: 176/190/54
CMYK: 23/0/100/17
Yellow
HEX: #F9B617
RGB: 249/182/23
CMYK: 0/30/100/0
Teal
HEX: #018AB0
RGB: 1/138/176
CMYK: 100/0/10/25
Purple
HEX: #682976
RGB: 104/41/118
CMYK: 12/65/0/54

Gradients & Textures

Dark Blue to Blue
#214396 – #2273BA
Blue Glass Overlay

Typography

Figtree is a clean and friendly geometric sans serif font. It works well for body text, yet still retains some punch when used in uppercase – perfect for buttons and short labels. Figtree comes as a variable font with 7 legacy weights, light through black, and supports 280+ Latin languages.

Heading 1

FIGTREE | LIGHT | 53/72

Heading 2

FIGTREE | MEDIUM | 38/45

Heading 3

FIGTREE | SEMIBOLD | 23/30

Heading 4

FIGTREE | SEMIBOLD | 20/30

Paragraph XLarge

FIGTREE | REGULAR | 33/43

Paragraph normal style dolor sit amet, consectetur adipiscing elit. Morbi et congue arcu, eu facilisis augue. Aenean scelerisque tristique consequat. Etiam et elementum massa.

FIGTREE | Regular | 17/26
Paragraph small style dolor sit amet, consectetur adipiscing elit. Morbi et congue arcu, eu facilisis augue. Aenean scelerisque tristique consequat. Etiam et elementum massa, ut tincidunt mauris.
FIGTREE | Regular | 14/21
  • Unordered list item
  • Unordered list item
  • Unordered list item

FIGTREE | Regular | 17/26

Buttons

Primary | Normal State
Primary | Hover State
Secondary | Normal State
Secondary | Hover State

Icons

Basic Icons
Custom icon set
Detailed Icons
Detailed icons
Two color icons
Downloads

The basic icons are open source icons. You can view and download more icons from this family on the Feather Icons website.

Some of the detailed icons are stock icons that have been licensed by AMG and are free to be used by AMG business units. See the license information for more details. Some detailed icons were obtained from the Noun Project website with an appropriate license.

Photography

The AMG website uses proprietary images where possible and supplements with stock photography. The images chosen should represent the subject matter of the page or content. AMG does not use stock images containing people that are identifiable. The images are edited with cool (blue) undertones and moderate contrast.

Facility Aerials

Facility Equipment

Sustainability

Investors

Stock Photo Downloads

Below are packaged stock imagery that has been licensed by AMG and are free to be used by AMG business units. See the license information for more details.

Image Treatment Download

The .psd is a sample image treatment for a reference point. Use your discretion when editing / color grading images to achieve a similar look to the examples displayed above.

Page Components

Downloads

The AMG corporate website is built on WordPress and leverages a visual builder called Divi to help give website editors more flexibility to make edits to page layouts. A number of the page components displayed below can be downloaded and imported into other WordPress websites that use Divi to help streamline some of the styles and advance development.

Some of the modules may need to be adapted for use when implemented on your Divi theme. For example, by default these modules are using FontAwesome icons included with Divi. For best results, ‘Import Presets’ when importing the file into the Divi Library. You can then view this import by creating a new page and choosing the page layout from the library.

Text Boxes

With Link

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Vivamus eget auctor sem. Nulla molestie nunc elit, eu pharetra leo malesuada non. Cras vitae dolor tortor.

Without Link
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce auctor mi nec lobortis.
With Caption
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Vivamus eget auctor sem. Nulla molestie nunc elit, eu pharetra leo malesuada non. Cras vitae dolor tortor.

Tables

Grey Table Header
Title Title
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Blue Table Header
Title Title
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet
Lorem ipsum Dolor sit amet

Forms

Select fields
Input fields


Filter with Search

Accordions

Accordions should be used in moderation. While they can make a web page easier to read, they should be used to describe situations or deliver information clearly. If users need to see most or all of the information on a page, it is better to use well-formatted text instead.

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed venenatis ut lectus convallis pulvinar. Cras non erat quis ipsum dapibus mattis. Vestibulum ultrices ex et tempus dictum. Sed eu eros felis. Sed dignissim arcu et vestibulum porta. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras diam augue, scelerisque nec malesuada et, hendrerit vel magna. Integer leo nibh, dignissim ut dapibus a, sodales eget neque. Phasellus suscipit est diam, eu viverra dui bibendum non.

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed venenatis ut lectus convallis pulvinar. Cras non erat quis ipsum dapibus mattis. Vestibulum ultrices ex et tempus dictum. Sed eu eros felis. Sed dignissim arcu et vestibulum porta. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras diam augue, scelerisque nec malesuada et, hendrerit vel magna. Integer leo nibh, dignissim ut dapibus a, sodales eget neque. Phasellus suscipit est diam, eu viverra dui bibendum non.

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed venenatis ut lectus convallis pulvinar. Cras non erat quis ipsum dapibus mattis. Vestibulum ultrices ex et tempus dictum. Sed eu eros felis. Sed dignissim arcu et vestibulum porta. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras diam augue, scelerisque nec malesuada et, hendrerit vel magna. Integer leo nibh, dignissim ut dapibus a, sodales eget neque. Phasellus suscipit est diam, eu viverra dui bibendum non.
AMG logo

Corporate Office

435 Devon Park Drive
Building 200
Wayne, PA 19087
United States

info@amg-nv.com

Investor Relations & Media Contact

Michele Fischer
Vice President Investor Relations

+1 610 975 4979
mfischer@amg-nv.com

Copyright © AMG 2023

Terms & Conditions

Privacy Policy