planche de référence
Styleguide
Tous les composants de Kozmo, dans les deux thèmes. Le décor est dessiné ; le contenu, les champs et les boutons restent nets et lisibles. Les règles sont détaillées dans DESIGN.md.
Nuit
Typographie
Caveat pour les titres et les notes, Atkinson Hyperlegible Next pour tout le reste.
Mon serveur Minecraft
Sous-titre manuscrit, pour les sections
une note dans la marge, avec sa flèche
Le texte courant reste net et très lisible : 17 px, interligne 1,6, jamais en manuscrit. Les liens sont soulignés et colorés.
Texte secondaire : métadonnées, aides de formulaire.
Couleurs
Chaque paire texte / papier passe WCAG AA.
- Papier
--paper - Papier surélevé
--paper-raised - Papier creusé
--paper-sunk - Encre
--ink - Encre douce
--ink-soft - Encre pâle
--ink-faint - Jaune soleil
--sun - Rose nébuleuse
--nebula - Bleu glacier
--glacier - Mousse
--moss - Braise
--ember
Boutons
Le trait bouge et un gribouillis se dessine au survol.
Champs
Visible par tout le monde.
Lettres minuscules, chiffres et tirets uniquement.
Cartes
Trait fin et discret. Une seule carte surélevée par écran.
Simple
Papier surélevé et trait fin. Le cas par défaut.
Surélevée
Ombre douce : pour l'élément principal de l'écran.
Scotchée
Pour une image ou une note épinglée.
Croquis
Trait seul, sans fond, pour les encarts secondaires.
Badges
Interrupteur, menu, modale
Tout se pilote au clavier.
Essaie au clavier : flèches, Échap.
Doodles
32 dessins, même trait. Les grands boudent un peu (ligne vivante).
Décor
rocketplanetplanet-cratersmoonsunstarsparklecometmeteortelescopesatelliteastronautufogalaxyorbitconstellation
Interface
arrowclosecheckplusmenusearchlinkimagelockeyeflaguserpenciltrashgripchevron
Planètes
Générées depuis la couleur, le style et le slug de l'espace.
Mouvement
Désactivé si « réduire les animations » est actif.
Carnet
Typographie
Caveat pour les titres et les notes, Atkinson Hyperlegible Next pour tout le reste.
Mon serveur Minecraft
Sous-titre manuscrit, pour les sections
une note dans la marge, avec sa flèche
Le texte courant reste net et très lisible : 17 px, interligne 1,6, jamais en manuscrit. Les liens sont soulignés et colorés.
Texte secondaire : métadonnées, aides de formulaire.
Couleurs
Chaque paire texte / papier passe WCAG AA.
- Papier
--paper - Papier surélevé
--paper-raised - Papier creusé
--paper-sunk - Encre
--ink - Encre douce
--ink-soft - Encre pâle
--ink-faint - Jaune soleil
--sun - Rose nébuleuse
--nebula - Bleu glacier
--glacier - Mousse
--moss - Braise
--ember
Boutons
Le trait bouge et un gribouillis se dessine au survol.
Champs
Visible par tout le monde.
Lettres minuscules, chiffres et tirets uniquement.
Cartes
Trait fin et discret. Une seule carte surélevée par écran.
Simple
Papier surélevé et trait fin. Le cas par défaut.
Surélevée
Ombre douce : pour l'élément principal de l'écran.
Scotchée
Pour une image ou une note épinglée.
Croquis
Trait seul, sans fond, pour les encarts secondaires.
Badges
Interrupteur, menu, modale
Tout se pilote au clavier.
Essaie au clavier : flèches, Échap.
Doodles
32 dessins, même trait. Les grands boudent un peu (ligne vivante).
Décor
rocketplanetplanet-cratersmoonsunstarsparklecometmeteortelescopesatelliteastronautufogalaxyorbitconstellation
Interface
arrowclosecheckplusmenusearchlinkimagelockeyeflaguserpenciltrashgripchevron
Planètes
Générées depuis la couleur, le style et le slug de l'espace.
Mouvement
Désactivé si « réduire les animations » est actif.