Système de design
Zen + Cosmos
Deux métaphores visuelles complémentaires. Changez de mode via l'en-tête. Clair = papier chaud, encre sumi, le moment local. Sombre = indigo profond, champ d'étoiles, ce qui le porte.
Typographie
Vis avec soin.
Pour toi, pour les autres, pour ce qui te porte.
Une carte est à la sagesse ce qu'un catalogue sur fiches est à une bibliothèque.
Corps de texte sans empattement. Inter / DM Sans. Base 16px, interligne 1,6.
Corps doux pour le texte secondaire.
Étiquette discrète, tout en capitales.
Dhp 5 · Quran 2:62 · BG 2.47 · Tao Te Ching 11 · Analects 4.16
Style de texte sacré — serif italique avec accent de bordure au début. hesed, anatta, wu wei apparaissent comme joyaux.
Palette des traditions
12 teintes harmonieuses, une par tradition. Variante zen en mode clair, variante plus lumineuse en cosmos pour la lisibilité sur fond profond.
Bouddhisme
buddhism
Islam
islam
Hindouisme
hinduism
Judaïsme
judaism
Christianisme
christianity
Sikhisme
sikhism
Taoïsme
taoism
Confucianisme
confucianism
Jaïnisme
jainism
Bahá'í
bahai
Zoroastrisme
zoroastrianism
Shinto
shinto
Boutons
Toutes avec une cible tactile ≥44×44. Contour focus-visible. Compatible avec la réduction des animations.
Badges
Pour les étiquettes de tradition, les paliers d'attestation, les marqueurs de thème. Chacun possède un aria-label pour les lecteurs d'écran.
Cartes
En mode cosmos, les cartes de tradition flottent avec un effet de verre et des halos de la couleur de la tradition au survol.
Citations
Guillemets adaptés à la langue. Superposition en écriture native le cas échéant.
Hatred ceases not by hatred, but by love. We work with being, but non-being is what we use. The superior man understands what is right; the inferior man understands what will sell. Héros enso / lune
Un élément unique qui se lit comme un enso (interruption de pinceau intentionnelle, mode zen) et comme une pleine lune (luminance radiale, mode cosmos). Changez de mode pour voir.
Bandeaux de traduction
Jetons de design
Surfaces
Animation
- --duration-fast: 150ms (focus, micro-affordance)
- --duration-base: 250ms (survol, transition de page)
- --duration-slow: 400ms (réajustement des cartes de mode)
- --duration-dusk: 600ms (fondu enchaîné zen ↔ cosmos)
- --ease-zen: cubic-bezier(0.4, 0, 0.2, 1)
Parité RTL
L'arabe et l'hébreu utilisent les propriétés logiques CSS (border-s, ps, ms). Exemple de direction ci-dessous :
حكمة من اثنتي عشرة تقليداً
«اقرأ باسم ربك الذي خلق»
Quran 96:1
חכמה משתים עשרה מסורות
"ואהבת לרעך כמוך"
Lev 19:18