HueOdyssey
Ouvrir la navigation
Français
Guide pratique de la palette

Palettes de couleurs aux tons naturels

Explorez des palettes de couleurs aux tons naturels avec sept rôles sémantiques, un contraste accessible, un aperçu d’interface réaliste et des valeurs HEX prêtes pour CSS.

background#F4F1E8
surface#FFFCF5
secondary#A67C52
primary#4F6F52
accent#C58C4A
muted#687266
text#253126

Pourquoi cette palette fonctionne

Les tons naturels inspirent la proximité lorsque les verts, les argiles et les neutres restent suffisamment distincts. Gardez le fond clair et utilisez la teinte la plus profonde pour le texte et la structure.

Les sept couleurs sont réparties entre action principale, soutien secondaire, accent, fond, surface, texte et contenu atténué. Cette répartition rend la palette utile au-delà d’une planche d’ambiance.

Comment l’utiliser

Mettre une action en avant

Utilisez la couleur principale pour les appels à l’action et les liens, pas pour chaque élément décoratif.

Protéger le contraste de lecture

Associez le texte à des fonds et surfaces conformes au niveau WCAG AA.

Réserver la couleur d’accent

L’accent fonctionne mieux pour les badges, les mises en valeur et les moments qui nécessitent de l’attention.

Directions associées

Questions fréquentes

Puis-je utiliser ces couleurs dans un projet commercial ?

Oui. Les valeurs HEX sont des données colorimétriques, pas des ressources sous licence. Adaptez la palette à votre interface et au contexte de votre marque.

La palette respecte-t-elle les exigences WCAG ?

Le rôle texte est vérifié sur le fond et la surface. Contrôlez à nouveau le contraste après toute modification de couleur, police, taille ou graisse.