🎨 EP Digital × MIST Normandie · Design System v2

Le socle visuel du nouveau site.

Tokens, composants et patterns réutilisés sur toutes les pages — un seul fichier à éditer pour faire évoluer tout le site. Direction « Frenchy serious 2026 » : chaleureux, arrondi, profondeur, micro-interactions.

Charte officielle

Palette de couleurs

Bleu primaire · orange accent (CTA) · vert santé (parcimonie). Charte PDF : aucune autre couleur autorisée.

PRIMAIRE & ACCENT
Bleu MIST
#3E4982
Primaire
Bleu profond
#2A3265
Fonds, hover
Orange MIST
#E94E1B
Accent / CTA
Vert santé
#6FBF8A
Parcimonie
SECONDAIRES & DÉGRADÉS
Violet clair
#A69DCD
Lavande
#E4E1F2
Corail
#EE6F5F
Jaune
#F6A124
Dégradé marque
brand
Dégradé accent
accent
NEUTRES & FONDS
Encre
#1F2444
Encre douce
#4A5076
Estompée
#8B91AE
Fond mist
#F2F0F9
Typographie · harmonisée

Échelle typographique

Titres Mulish, corps Inter. Échelle modulaire à ratio constant et poids cohérents (800) — fini le déséquilibre H1/H2.

EyebrowSanté au travail · Normandie
H1 · 800 · 52pxVotre allié prévention
Mot-clé · option AVotre allié prévention au quotidien
Mot-clé · option BVotre allié prévention au quotidien
H2 · 800 · 38pxSix expertises, une équipe
H3 · 800 · 27pxPrévenir la désinsertion
H4 · 700 · 19pxSuivi de santé adapté
LeadDepuis 70 ans, MIST Normandie accompagne les entreprises et leurs salariés.
CorpsTexte courant en Inter — moderne, lisible, accessible. Le médecin, l'infirmier et l'IPRP interviennent ensemble.
Small / mutedMention secondaire, légende · 13.5px
Composants

Boutons

Dégradés subtils + ombres teintées. Bleu = primaire, orange = conversion, verre = sur fond imagé.

VARIANTES
TAILLES
Composants

Badges & filtres

Catégorisation des événements/formats/statuts et filtres de listes (JetSmartFilters en prod).

BADGES
Webinaire Présentiel 🔒 Adhérent Nouveau
FILTRES (CHIPS)
TousWebinairesPrésentielReplays
Composants

Cartes raffinées

Reflet interne, bordure dégradée, conteneur d'icône, hover avec glow. Variante verre pour les surfaces premium.

Expertise pluridisciplinaire

Médecins, infirmiers, IPRP, psychologues — une équipe complète.

Découvrir →

Trouver ma MIST

Bordure dégradée — pour les blocs à mettre en avant.

Lancer →
Mis en avant

Prévention en entreprise

Carte pleine couleur, dégradé marque + reflet.

Composants

Formulaires

Inscriptions (événements, formations) et calculateur « Trouver ma MIST ».

Fondations 2026

Profondeur, verre & dégradés

Rayons généreux, ombres multi-couches, glassmorphisme et dégradés subtils — la signature moderne.

RAYONS
14 · S
22 · M
30 · L
42 · XL
OMBRES
soft
med
glow
VERRE (sur fond dégradé)

Glassmorphisme

Surface translucide, flou d'arrière-plan, bord lumineux.

Profondeur

Hiérarchie par couches, pas par contours durs.

Subtilité

Dégradés discrets, jamais criards.

Assemblages

Exemples de sections

Blocs assemblés à partir des composants — l'aperçu du rendu réel du site.

HERO
Service de santé au travail · depuis 1953

Bien plus que la médecine du travail. Votre allié prévention.

Votre allié prévention au quotidien, partout en Normandie.

Photo équipe
CHIFFRES CLÉS
70+

ans d'expertise

13

centres en Normandie

13K+

entreprises

80K+

salariés suivis

BANDEAU CTA (fond foncé)

Prêt à faire de la prévention votre meilleur allié ?