L’essentiel en bref
- Un dégradé pastel fond des couleurs pâles, très claires et à la saturation douce, comme le rose poudré, le beurre, le lilas et la menthe.
- Le texte blanc ne fonctionne presque jamais sur un dégradé pastel ; une encre sombre d’une teinte voisine et profonde se lit bien plus facilement.
- Un dégradé pastel paraît sucré quand toutes les couleurs sont également douces et saturées, et frais quand une couleur est plus poudrée, plus profonde ou inattendue.
- Un fond blanc cassé façon papier sous la couleur pastel la fait paraître imprimée et calme plutôt que numérique.
- OKLCH rend les pastels faciles : gardez la luminosité et le chroma fixes et ne changez que la teinte.
Sur cette page
Un dégradé pastel est un fondu de couleurs pâles et doucement teintées : rose poudré vers beurre, lilas vers ciel, menthe vers crème. Les pastels ont une luminosité élevée et très peu de saturation, ce qui explique leur côté doux, frais et amical. Le hic, c’est qu’il est aussi facile de les rendre trop sucrés, et presque impossible d’y lire du texte blanc. Les deux se corrigent avec une encre sombre, un fond papier et une couleur un peu moins évidente que les autres.
Ce qui rend une couleur pastel
Un pastel est une couleur qui contient beaucoup de blanc : luminosité élevée, saturation faible à modérée. Dans l’espace colorimétrique OKLCH, la plupart des pastels se situent autour de 0,88 à 0,95 de luminosité avec un petit chroma. Cela donne une astuce pour des dégradés pastel réguliers : fixez la luminosité et le chroma, et ne changez que la teinte. Chaque couleur porte alors le même poids visuel, et aucune ne crie.
Frais ou sucré : la différence
Les pastels basculent dans le sucré quand tout est également doux : rose, bleu layette et lilas à la même saturation, texte blanc, tout arrondi. Ils paraissent frais quand quelque chose dans le design fait contrepoids. Ce peut être une couleur plus poudrée et plus grise, une encre profonde pour les mots, un fond blanc cassé façon papier ou une typographie nette et sérieuse.
Sucré
- Rose, bleu layette et lilas à intensité égale
- Texte blanc sur un fond pâle
- Fond blanc pur, parfaitement lisse
- Tous les éléments arrondis et bulleux
Frais
- Une couleur poudrée ou inattendue, comme la sauge ou l’abricot
- Une encre profonde d’une teinte voisine
- Un fond blanc cassé façon papier avec un léger grain
- Un empattement assuré ou un sans-serif serré pour les mots
Associer les pastels à une encre sombre
Un texte blanc sur un pastel échoue presque toujours au contraste, car les deux sont très clairs. La solution est une encre sombre : une version profonde de l’une des teintes du dégradé, comme l’indigo sur le lilas ou le bordeaux sur le rose poudré. Elle garde la palette dans une même famille et se lit confortablement. Voici des rapports mesurés pour des encres courantes sur fonds pastel. Pour les règles qui les sous-tendent, voyez le contraste des couleurs et l’accessibilité.
| Couleur du texte | Sur rose poudré `#fbcfe8` | Sur lilas `#c4b5fd` |
|---|---|---|
#ffffff blanc | 1,4:1, échec | 1,9:1, échec |
#6b7280 gris moyen | 3,5:1, grand texte seulement | 2,6:1, échec |
#9d174d bordeaux | 5,7:1, réussit AA | 4,3:1, grand texte seulement |
#312e81 indigo | 8,3:1, réussit AAA | 6,2:1, réussit AA |
#1f2937 encre | 10,6:1, réussit AAA | 8,0:1, réussit AAA |
Utiliser un fond papier
Les pastels sur du blanc pur peuvent paraître délavés, et à l’écran, le blanc pur est ce qu’il y a de plus lumineux. Un fond blanc cassé chaud, comme #f8f1ea, donne aux pastels un air voulu, comme de l’aquarelle ou de l’encre risographique sur papier. Laissez le pastel éclore depuis un coin et s’estomper dans le papier, plutôt que de remplir toute la surface.
Un léger grain pousse plus loin la sensation de papier. Gardez-le très discret sur les pastels, car le bruit se voit facilement sur les couleurs claires ; les dégradés granuleux donnent des quantités de départ.
Un dégradé pastel en CSS
En CSS, le fond papier, l’éclosion et l’encre se rejoignent en quelques lignes. Mélanger les pastels en OKLCH évite que le milieu tourne à la craie quand les teintes sont éloignées, et un point de transition laisse le papier occuper l’essentiel de la surface.
.pastel {
background-color: #f8f1ea; /* paper */
background-image:
radial-gradient(circle at 15% 10%, #fbcfe8 0%, transparent 45%),
radial-gradient(circle at 90% 85%, #d5e3d0 0%, transparent 50%),
linear-gradient(160deg in oklch, #f8f1ea, 60%, #e9d5ff);
color: #312e81; /* indigo ink */
}Gardez les paires pastel proches en teinte pour le résultat le plus net, comme dans les dégradés à deux couleurs. Quand vous voulez vraiment associer des pastels éloignés, faites-les passer par un lilas pâle ou un beurre pour que le milieu reste teinté au lieu de virer à un gris blanchâtre.
Où les dégradés pastel fonctionnent
- Beauté, soins de la peau, bien-être et parfum
- Bébé, mariage, papeterie et cadeaux
- Campagnes de printemps et de Pâques, boulangeries et cafés
- Onboarding de logiciel apaisant et pages d’aide
- Esthétiques douces et rêveuses, surtout avec un reflet holographique ; voyez les dégradés holographiques
Un champ pastel avec une encre sombre se lit comme calme et assuré à la taille d’un fil.
Le même style en story, avec la couleur qui éclôt depuis le haut.
Si vous aimez la douceur mais voulez plus de contraste, faites un pas vers les arrière-plans esthétiques avec un accent plus profond. Vous pouvez aussi chercher sur le Marché des mots comme « lilas doux » ou « pêche pâle » pour trouver des Marks pastel et créer avec eux tout de suite.
Les questions qu’on nous pose
Qu’est-ce qu’un dégradé pastel ?
Un dégradé pastel est un fondu de couleurs pâles et doucement saturées, comme le rose poudré, le lilas, le beurre et la menthe.
Quelle couleur de texte sur un dégradé pastel ?
Une encre sombre, idéalement une version profonde de l’une des teintes du dégradé, comme l’indigo ou le bordeaux. Le texte blanc échoue en général au contraste sur les pastels.
Comment rendre régulières les couleurs d’un dégradé pastel ?
Construisez-les en OKLCH avec la même luminosité et le même chroma, en ne changeant que la teinte : chaque couleur porte alors le même poids.
Comment éviter qu’un dégradé pastel paraisse trop sucré ?
Ajoutez une couleur poudrée ou inattendue, utilisez une encre sombre pour le texte, posez-le sur un fond blanc cassé façon papier et associez-le à une typographie assurée.
Quelle couleur de fond avec des pastels ?
Un blanc cassé chaud comme #f8f1ea donne aux pastels un air imprimé et calme ; le blanc pur peut les faire paraître délavés.
Écrit par Gradiently
L’équipe derrière Gradiently, un outil de création construit autour des Marks : des dégradés vivants qui donnent à tout ce que vous créez votre propre signature.
Voir notre profil
