Colors

  • Purple

    • RGB 126, 97, 255
    • CMYK 0.506, 0.620, 0.000, 0.000
    • HEX #7E61FF
  • Purple - Tint 1

    • RGB 147, 122, 255
    • CMYK 0.424, 0.522, 0.000, 0.000
    • HEX #937AFF
  • Purple - Tint 2

    • RGB 167, 148, 255
    • CMYK 0.345, 0.420, 0.000, 0.000
    • HEX #A794FF
  • Purple - Tint 3

    • RGB 188, 173, 255
    • CMYK 0.263, 0.322, 0.000, 0.000
    • HEX #BCADFF
  • Purple - Tint 4

    • RGB 209, 198, 255
    • CMYK 0.180, 0.224, 0.000, 0.000
    • HEX #D1C6FF
  • Purple - Shade 1

    • RGB 90, 61, 179
    • CMYK 0.497, 0.659, 0.000, 0.298
    • HEX #5A3DB3
  • Purple - Shade 2

    • RGB 51, 32, 94
    • CMYK 0.457, 0.660, 0.000, 0.631
    • HEX #33205E
  • Dark

    • RGB 26, 16, 47
    • CMYK 0.447, 0.660, 0.000, 0.816
    • HEX #1A102F
  • Red

    • RGB 255, 95, 125
    • CMYK 0.000, 0.627, 0.510, 0.000
    • HEX #FF5F7D
  • Orange

    • RGB 255, 156, 91
    • CMYK 0.000, 0.388, 0.643, 0.000
    • HEX #FF9C5B
  • Yellow

    • RGB 255, 203, 96
    • CMYK 0.000, 0.204, 0.624, 0.000
    • HEX #FFCB60
  • Green

    • RGB 92, 215, 170
    • CMYK 0.572, 0.000, 0.209, 0.157
    • HEX #5CD7AA
  • Green 2

    • RGB 63, 179, 163
    • CMYK 0.648, 0.000, 0.089, 0.298
    • HEX #3FB3A3
  • Gray

    • RGB 120, 110, 175
    • CMYK 0.314, 0.371, 0.000, 0.314
    • HEX #786EAF
  • Gray - Tint 1

    • RGB 145, 133, 208
    • CMYK 0.303, 0.361, 0.000, 0.184
    • HEX #9185D0
  • Gray - Tint 2

    • RGB 180, 172, 226
    • CMYK 0.204, 0.239, 0.000, 0.114
    • HEX #B4ACE2
  • Gray - Tint 3

    • RGB 217, 213, 241
    • CMYK 0.100, 0.116, 0.000, 0.055
    • HEX #D9D5F1
  • Gray - Shade 1

    • RGB 92, 82, 146
    • CMYK 0.370, 0.438, 0.000, 0.427
    • HEX #5C5292
  • Gray - Shade 2

    • RGB 69, 62, 109
    • CMYK 0.367, 0.431, 0.000, 0.573
    • HEX #453E6D
  • Gray - Shade 3

    • RGB 44, 38, 76
    • CMYK 0.421, 0.500, 0.000, 0.702
    • HEX #2C264C

Typography

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

0123456789

  • Light 300
  • Regular 400
  • Medium 500
  • Semibold 600
  • Bold 700
  • Aa

    Headings

  • Aa

    Subheadings

  • Aa

    Body text

Spacing

Headings

Headings should have a line height of 1.3em or {font size} * 1.3

Body text

Body text should have a line height of 1.75em or {font size} * 1.75

Text colors

  • Purple

    Used for subheadings that sit above main headings. Use only on light backgrounds.

  • Purple - Tint 3

    Used for body text and other scenarios in which a more subdued color is appropriate. Use only on dark backgrounds.

  • Purple - Tint 4

    Used for body text and other scenarios in which a more subdued color is appropriate. Use only on purple backgrounds.

  • Gray

    Used for body text and other scenarios in which a more subdued color is appropriate. Use only on light backgrounds.

  • Gray - Tint 2

    Used for subheadings in which a more subdued color than purple is appropriate. Use only on light backgrounds.

  • Gray - Shade 1

    Used for body text inside articles with multiple paragraphs.

Design Elements

The following are various visual elements used to reflect the Emailable brand.

    Dark Gradient

    Used for whenever a dark background is needed/desired. This gradient is a circle with its center originating 20% from the right and 20% from the bottom of the element.

    • 0%Purple - Shade 2
    • 100%Dark

    Purple Gradient

    Used for whenever a lighter, more colorful background is needed/desired. This gradient is a circle with its center originating 20% from the right and 20% from the bottom of the element.

    • 0%Purple
    • 100%Purple - Shade 1

See why thousands of the world's largest companies trust Emailable for email deliverability.

Get Started Free

250 free credits