<img alt="" src="https://secure.wire0poor.com/215720.png" style="display:none;">

Widewail Brand Assets

Please use the information below to ensure stylistic consistency across all Widewail assets

Logos

For use on light backgrounds
wordmark-dark
For use on dark backgrounds
wordmark-light
For use on light backgrounds
logo-dark
For use on dark backgrounds
logo-light

Colors

Yellow

HEX:#FFC322

  • Call To Action Background
  • Text Highlights
  • Splash Background
  • Photo overlays
  • Brand Icon Highlights

Dark Yellow

HEX:#E9AC25

  • Call To Action Hover Background
  • Splash Background
  • Photo overlays
  • Brand Icon Highlights

Pale Yellow

HEX:#FED684

  • Call To Action Disabled Background
  • Splash Background
  • Photo overlays

Blue

HEX:#1F9ED5

  • Button Background
  • Text Link Hover
  • Border

Dark Blue

HEX:#125F7D

  • Text Links
  • Splash Backgrounds
  • Button Hover Background

Pale Blue

HEX:#64B8DE

  • Button Disabled Background
  • Text Link Disabled

Black

HEX:#2F292B

  • Headlines on Light Background
  • Display Text on Light Background
  • Splash Background
  • Icons / Brand Icons
  • Border 
  • Logo on Light Background

Dark Gray

HEX:#4B4C4C

  • Icons
  • Brand Icons
  • Border Color

Muted Dark Gray

HEX:#666766

  • Headlines on Light Background
  • Display Text on Light Background
  • Splash Background
  • Icons
  • Brand Icons
  • Border

Medium Dark Gray

HEX:#868E96

  • Disabled Text on Light Background
  • Border

Medium Light Gray

HEX:#E4E4E2

  • Display Text on Dark Background
  • Splash Background
  • Border

Light Gray

HEX:#F4F5F5

  • Splash Background
  • Border

Muted Light Gray

HEX:#F2F2F2

  • Headlines on Dark Background
  • Display Text on Dark Background
  • Splash Background
  • Border

White

HEX:#FAFAFA

  • Headlines on Dark Background
  • Display Text on Dark Background
  • Splash Background
  • Border

Red

HEX:#ED1C24

  • Error Messaging On Light Background
  • Error Messaging Background
  • Delete/Remove Interactions
  • Negative Numbers

Red Dark

HEX:#D21118

  • Error Messaging Hover
  • Delete/Remove Interactions Hover
  • Negative Numbers Hover

Pale Red

HEX:#ffc0cb

  • Error Messaging Disabled
  • Delete/Remove Interactions Disabled
  • Negative Numbers Disabled

Green

HEX:#72C163

  • Success Messaging On Light Background
  • Success Messaging Background
  • Positive Numbers

Dark Green

HEX:#1AAA4B

  • Success Messaging Hover
  • Positive Numbers Hover

Pale Green

HEX:#A3D699

  • Success Messaging Disabled
  • Positive Numbers Disabled

Typography

H1 Proxima Nova Sample Headline Text

Font Size:90px | Line Height:99px | Weight: 400


H2 Proxima Nova Sample Headline Text

Font Size:48px | Line Height:48px | Weight: 200


H3 Proxima Nova Sample Headline Text

Font Size:36px | Line Height:43px | Weight: 200


H4 Proxima Nova Sample Headline Text

Font Size:28px | Line Height:31px | Weight: 200


H5 Proxima Nova Sample Headline Text

Font Size:18px | Line Height:27px | Weight: 600


H6 Proxima Nova Sample Headline Text

Font Size:14px | Line Height:17px | Weight: 400


Proxima Nova Paragraph Sample Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tincidunt sed velit quis aliquam. Quisque faucibus et neque eget faucibus. Donec feugiat odio quis quam vulputate imperdiet. Etiam venenatis, massa a sagittis posuere, purus enim ornare ipsum, vitae vulputate tellus eros non lectus.

Font Size:18px | Line Height:28px | Weight: 400


Proxima Nova Small Paragraph Sample Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tincidunt sed velit quis aliquam. Quisque faucibus et neque eget faucibus. Donec feugiat odio quis quam vulputate imperdiet. Etiam venenatis, massa a sagittis posuere, purus enim ornare ipsum, vitae vulputate tellus eros non lectus.

Font Size:16px | Line Height:24px | Weight: 400

How to Write Out Widewail


Widewail's name is always written as one word with a capitalized leading W.

The logo is the only place that the leading W should not be capitalized.

Widewail