Icon

When using the Emailable icon, be sure to leave ample space around the perimeter of the icon (examples can be found inside the logo kit). Also be sure to use the correct version of the icon depending on the scenario in which it is to be used so that any of the icon's colors do not become difficult to see (see below).

  • Emailable icon  main
    Emailable icon  main

    Main

    Use the main version on light or dark backgrounds. Preferred background colors: White, Dark, Dark Gradient

  • Emailable icon  black

    Black

    Use the black version on light backgrounds. Preferred background colors: Purple - Shade 2, Dark, Dark Gradient

  • Emailable icon  white

    White

    Use the white version on dark backgrounds when color use is limited or when absolutely needed. Preferred background colors: Purple - Shade 2, Dark, Purple Gradient, Dark Gradient

Couleurs

  • Violet

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

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

    • RGB 167, 148, 255
    • CMYK 0.345, 0.420, 0.000, 0.000
    • HEX #A794FF
  • Violet - Teinte 3

    • RGB 188, 173, 255
    • CMYK 0.263, 0.322, 0.000, 0.000
    • HEX #BCADFF
  • Violet - Teinte 4

    • RGB 209, 198, 255
    • CMYK 0.180, 0.224, 0.000, 0.000
    • HEX #D1C6FF
  • Violet - Teinte 1

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

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

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

    • 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
  • Jaune

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

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

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

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

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

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

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

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

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

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

Typographie

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

0123456789

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

    Titres

  • Aa

    Sous-titres

  • Aa

    Le corps du texte

Espacement

Titres

Les titres doivent avoir une hauteur de ligne de 1.3em ou {font size} * 1.3

Le corps du texte

Le corps du texte doit avoir une hauteur de ligne de 1.75em ou {font size} * 1.75

Couleurs du texte

  • Violet

    Utilisé pour les sous-titres qui se trouvent au-dessus des titres principaux. Utilisez uniquement sur des arrière-plans clairs.

  • Violet - Teinte 3

    Utilisé pour le corps du texte et d'autres scénarios dans lesquels une couleur plus sobre est appropriée. Utilisez uniquement sur des arrière-plans sombres.

  • Violet - Teinte 4

    Utilisé pour le corps du texte et d'autres scénarios dans lesquels une couleur plus sobre est appropriée. Utilisez uniquement sur des arrière-plans violets.

  • Gris

    Utilisé pour le corps du texte et d'autres scénarios dans lesquels une couleur plus sobre est appropriée. Utilisez uniquement sur des arrière-plans clairs.

  • Gris - Teinte 2

    Utilisé pour les sous-titres dans lesquels une couleur plus sobre que le violet est appropriée. Utilisez uniquement sur des arrière-plans clairs.

  • Gris - Teinte 1

    Utilisé pour le corps du texte à l'intérieur des articles avec plusieurs paragraphes.

Éléments de Design

    Dégradé Sombre

    Utilisé chaque fois qu'un fond sombre est nécessaire/souhaité. Ce dégradé est un cercle dont le centre part à 20% de la droite et à 20% du bas de l'élément.

    • 0%Violet - Teinte 2
    • 100%Sombre

    Dégradé Violet

    Utilisé chaque fois qu'un arrière-plan plus clair et plus coloré est nécessaire/souhaité. Ce dégradé est un cercle dont le centre part à 20% de la droite et à 20% du bas de l'élément.

    • 0%Violet
    • 100%Violet - Teinte 1

Découvrez pourquoi des milliers des plus grandes entreprises au monde font déjà confiance à Emailable pour la délivrabilité de leurs emails.

Découvrir Gratuitement

250 crédits offerts