Primary Color
‘Bright Red’
Hex #A30E34
hsla(345, 84%, 35%, 1)
Usage options: H1 text, dividers, primary button color, icons, secondary button & text input area outline, inline linked text
Primary Color (60%)
Hex #A30E34
hsla(345, 84%, 35%, .6)
Usage options: Primary button in ‘none’ state, error state background
Accent Color
‘Blue Accent’
Hex #3DA5DF
hsla(345, 84%, 35%, 1)
Usage options: Boders of images, cards, hover state of primary button, focus state of text input fields
Accent Color (60%)
‘Blue Accent’
Hex #3DA5DF
hsla(345, 84%, 35%, .6)
Usage options: The following in a ‘none’ state: Boders of images, cards, hover state of primary button, focus state of text input fields
Secondary Color
‘Logo Gold’
Hex #BB812D
hsla(35, 61%, 45%, 1)
Usage options: Borders & dividers between headers div blocks, & containers
Secondary Color (60%)
‘Logo Gold’
Hex #BB812D
hsla(35, 61%, 45%, .6)
Usage options: Objects, containers, sections, in ‘none’ state
Dark Text
‘black’
Hex #333333
hsla(0, 0%, 20%, 1)
Usage options: Header & body text when primary color is not used
Grey Text
‘Dim Grey’
Hex #6D6D6D
hsla(0, 0%, 43%, 1)
Usage options: Subheaders as needed, text imput field text, product text labels
Avenir Next Regular
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn
Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890
Avenir Next Regular
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn
Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890
font-family: Avenir Next;
font-style: normal;
font-weight: 400;
line-height: 33px;
letter-spacing: 0em;
text-align: left;
Usage options: All H tags, body text
font-family: Avenir Next;
font-style: normal;
font-weight: 700;
line-height: 33px;
letter-spacing: 0em;
text-align: left;
Usage options: Product name in small cards, prices, emphasized text as needed

Visual Aesthetic
The overall visual style and flow was design to relate to and be complimentary of the HMP logo
Heading 1

Heading 2
Accent color was added to emphasize category cards & products images
Primary & Secondary buttons integrated blue accent color into states