Aller au contenu
SkillCodex

ADN du style

Même carte, quatre styles

Une seule carte de tableau de bord avec le même titre, la même métrique, le même état, la même action et la même mini-visualisation. Seuls les tokens et traitements documentés changent : ce que tu vois varier, c’est le style, pas le contenu.

Contenu, hiérarchie et états sont strictement identiques sur les quatre cartes ; des tests le vérifient.

Mettre un style en avant

Les quatre cartes restent visibles ; celle que tu choisis est mise en évidence et son ADN est résumé dessous.

Les quatre rendus

  • Rapport hebdomadaire

    Sessions actives

    12 480+8,2 % vs semaine dernière

    Dans les clous

    Ouvrir la fiche du style
    Même carte, rendue en Glassmorphism.
  • Rapport hebdomadaire

    Sessions actives

    12 480+8,2 % vs semaine dernière

    Dans les clous

    Ouvrir la fiche du style
    Même carte, rendue en Neobrutalism.
  • Rapport hebdomadaire

    Sessions actives

    12 480+8,2 % vs semaine dernière

    Dans les clous

    Ouvrir la fiche du style
    Même carte, rendue en Neumorphism.
  • Rapport hebdomadaire

    Sessions actives

    12 480+8,2 % vs semaine dernière

    Dans les clous

    Ouvrir la fiche du style
    Même carte, rendue en Flat Design.

Style sélectionné : Glassmorphism

Ce qui le définit

  • Une surface semi-transparente qui floute ce qui passe derrière elle sans le masquer.
  • Un fond coloré ou imagé qui reste visible à travers les panneaux et porte la palette.
  • Un bord clair fin qui sépare le verre des surfaces voisines.
Ouvrir l’ADN complet du style

Style sélectionné : Neobrutalism

Ce qui le définit

  • Un trait sombre uniforme et visible sur les cartes, boutons, champs et images.
  • Une ombre pleine décalée, sans aucun flou.
  • Des aplats saturés posés franchement sur un fond clair.
Ouvrir l’ADN complet du style

Style sélectionné : Neumorphism

Ce qui le définit

  • Le fond et les contrôles partagent exactement la même teinte mate.
  • Une ombre claire et une ombre sombre décrivent un éclairage diagonal constant.
  • Les états actifs inversent les ombres vers l’intérieur de la surface.
Ouvrir l’ADN complet du style

Style sélectionné : Flat Design

Ce qui le définit

  • Chaque surface utilise une couleur franche, sans texture ni reflet.
  • Aucun biseau, aucune ombre réaliste, aucun volume décoratif.
  • Poids, taille et couleur de la typographie organisent l’information à la place du relief.
Ouvrir l’ADN complet du style