Designsystem

Couleurs de texte 

<p class="text-primary">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-primary-dark">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-primary-complement">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>

<p class="text-grey-nero">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-grey-dove">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-grey-swirl">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-grey-smoke">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>

<p class="text-yellow">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-turquoise">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-carmine">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-gold">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-orange">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-pink">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
<p class="text-blue">Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper.</p>
 
<p class="text-primary">{{ text }}</p>
<p class="text-primary-dark">{{ text }}</p>
<p class="text-primary-complement">{{ text }}</p>

<p class="text-grey-nero">{{ text }}</p>
<p class="text-grey-dove">{{ text }}</p>
<p class="text-grey-swirl">{{ text }}</p>
<p class="text-grey-smoke">{{ text }}</p>

<p class="text-yellow">{{ text }}</p>
<p class="text-turquoise">{{ text }}</p>
<p class="text-carmine">{{ text }}</p>
<p class="text-gold">{{ text }}</p>
<p class="text-orange">{{ text }}</p>
<p class="text-pink">{{ text }}</p>
<p class="text-blue">{{ text }}</p>
 
{
  "text": "Donec in arcu mi. Nam condimentum purus purus, nec aliquam nunc eleifend semper."
}

Couleurs de texte (color)

Liste des couleurs disponibles :

  • couleur #000000 text-black

  • couleur #ffffff text-white

  • couleur #e0001a text-primary

  • couleur #bf1615 text-primary-dark

  • couleur #00985f text-secondary

  • couleur #222222 text-grey-nero

  • couleur #6e6767 text-grey-dove

  • couleur #d1cdc7 text-grey-swirl

  • couleur #f2f2f2 text-grey-smoke

  • couleur #F6DC6B text-yellow

  • couleur #00A5B5 text-turquoise

  • couleur #9D002E text-carmine

  • couleur #B9975B text-gold

  • couleur #FC6E00 text-orange

  • couleur #F1A693 text-pink

  • couleur #99D4E5 text-blue