Typographie
Echelle typographique basee sur deux familles : Inter pour le texte courant et JetBrains Mono pour le timer, le code et les donnees numeriques.
Familles de polices
--font-inter (font-sans)
Inter - ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
--font-jetbrains (font-mono)
JetBrains Mono - ABCDEFGHIJKLM abcdefghijklm 0123456789
Display
Utilise pour les titres principaux de pages et les sections hero.
Speedcube Master
Speedcube Master
Headings
Titres de sections, cartes et sous-menus.
Speedcube Master
Speedcube Master
Speedcube Master
Body
Texte courant, descriptions et labels.
Le speedcubing est l'art de resoudre le Rubik's Cube le plus rapidement possible. Les meilleurs cubers resolvent le 3x3 en moins de 5 secondes.
Temps moyen de 12 solves. L'inspection dure 15 secondes maximum selon les regles WCA.
Derniere mise a jour il y a 3 minutes
Monospace
Timer, algorithmes, code et donnees numeriques. Utilise JetBrains Mono avec tabular-nums pour un alignement optimal des chiffres.
12.345
R U R' U' R' F R2 U' R' U' R U R' F'
--primary: #2563eb; --accent: #22c55e;
Bonnes pratiques
A faire
- Utiliser
tracking-tightsur les titres display et h1 - Utiliser
tabular-numspour les temps et statistiques - Garder
font-monopour les algorithmes et le timer - Limiter a 2-3 tailles par ecran pour la hierarchie
A eviter
- Melanger les familles sans raison fonctionnelle
- Utiliser des tailles en px hardcodees
- Plus de 3 niveaux de poids (
normal,medium,semibold,bold) par composant - Texte body en dessous de 12px (text-xs)