Charte graphique et couleurs

Les couleurs de BornToCraft en jeu, sur le site et sur Discord, avec les fichiers pour les réutiliser. Tout y est : rien d'autre n'est nécessaire pour rester dans la charte.

Charte v2 validée le 2 octobre 2026 ; déploiement en jeu et sur le site par lots. Ce que vous voyez aujourd'hui peut encore porter l'ancienne charte.

Коротко

• « Ardoise & laiton » : un fond ardoise, un seul accent (le laiton), un seul secondaire (la patine turquoise).
• Les grades sont des métaux (fer, cuivre, laiton, patine, acier, rubis), toujours avec un insigne.
• Raretés et niveaux des mobs ne changent pas ; leurs couleurs sont rappelées plus bas.
• Quatre fichiers à récupérer : jetons JSON, CSS, palette GIMP et planche SVG.

Le principe

La palette vient du logo v1.0 : l'ardoise des cubes isométriques donne la structure, le cuivre du médaillon et le laiton du sommet donnent la chaleur, le turquoise (la teinte la plus présente du logo) devient la patine, le sable devient le parchemin et les cubes verts la mousse. Une seule palette sert le jeu, le site et Discord.

Palette par rôles

Rôle	Hex	Usage
Fond profond	#1E222A	Cadre, voile, contour ; fond de page et pied de site
Champ	#242933	Fond de slot et de champ de saisie
Carte	#2E3440	Cartes, infobulle ; remplace le cuir du site
Panneau	#3B4252	Panneau de menu, surface élevée
Bouton	#434C5E	Bouton au repos
Liseré	#4C566A	Liseré interne, séparateur, bordure de 1 px
Texte éteint	#697A94	Désactivé, verrouillé ; jamais pour une information
Texte secondaire	#9AA7BE	Légendes, détails
Texte	#ECEFF4	Texte courant
Parchemin	#ECE0C8	Plaque de titre, texte long chaud
Laiton (clair #F0DAA2, ombre #96582B)	#E4BA53	Accent unique : sélection, onglet actif, action principale ; #8A5A12 sur le thème clair du site
Cuivre (clair #D69A70, ombre #7E4A24)	#C87941	Rivets, accent chaud
Patine (clair #72CFC3, ombre #2B7E73, profond #22635B)	#4CC2B2	Secondaire unique : liens, puce active, information
Mousse	#6EB27C	Décor et illustrations, aucun rôle d'interface
Positif	#A3BE8C	Succès, palier atteint
Avertissement	#EBCB8B	Avertissement, palier en cours
Négatif	#BF616A	Erreur, vie basse, refus
Info	#4CC2B2	Même teinte que la patine : l'information se reconnaît à son icône « i »

Grades en métaux

Grade	Métal	Clair	Base	Ombre
Joueur	fer	#D3D9E2	#9AA7BE	#5D6B82
Wayfarer (Payant I)	cuivre	#E2B08A	#C87941	#7E4A24
Pioneer (Payant II)	laiton	#F5E2A8	#E4BA53	#96582B
Ascendant (Payant III)	patine	#9BE3D8	#4CC2B2	#22635B
Staff	acier	#A9C4E6	#5E81AC	#34496A
Fondateur	rubis	#F08A93	#C93545	#6E1822

• Insigne et nom écrit, jamais la couleur seule : la couleur seule ne dit pas un grade (daltonisme, écran terne, Bedrock sans hexadécimal libre, petites tailles). Le préfixe en jeu est l'insigne puis le nom, sans crochets.
• Le texte d'un grade est un dégradé du clair vers la base. L'acier et le rubis en base sont trop sombres pour du texte sur ardoise : la base sert à l'insigne et aux aplats.
• Sur Discord, la couleur d'un rôle est le ton clair.

Raretés

Rareté	Hex	Rareté	Hex
Commun	#ECEFF4	Épique	#B48EAD
Peu commun	#A3BE8C	Légendaire	#EBCB8B
Rare	#81A1C1	Mythique	#D08770

Le nom de l'objet, le cadre de son infobulle (séparateur laiton) et le coin de son emplacement portent la même teinte. Spécial reste hors progression : nom blanc pur, rabattu sur #ECEFF4 à l'écran. Chaque objet porte exactement la teinte de sa rareté.

Niveaux des mobs

Validés le 8 septembre 2026. Badge Nv. N à gauche du nom, fond #2E3440, bordure de 1 px, hauteur de 11 px.

Niveaux	Texte et bordure	Niveaux	Texte et bordure
1–10	#ECEFF4	51–60	#B48EAD
11–20	#A3BE8C	61–70	#EBCB8B
21–30	#8FBCBB	71–80	#D08770
31–40	#88C0D0	81–90	#BF616A
41–50	#81A1C1	91 et plus	texte #ECEFF4, bordure #EBCB8B, SHINE discret

Le niveau vient du mob ; les fractions sont tronquées et, au-delà de 100, le vrai numéro reste affiché. La couleur dit un niveau absolu, pas un danger relatif.

Typographies

• Jeu : la police bitmap du jeu.
• Site : Cinzel pour les titres (500, 700, 900, capitales espacées), Nunito pour le texte (400, 600, 700), JetBrains Mono pour les données. Lora est retirée.

Motifs et mouvement

• Engrenage (logo, insigne de grade, icône du site, chargement) : jamais en fond répété, jamais dans un slot, un seul par vue.
• Rivets laiton aux quatre coins d'un panneau, jamais dans un slot, sur un bouton ou une jauge. Plaque gravée pour un titre non cliquable.
• Cuir et vapeur : site seulement. Le cuir reste un fond discret (8 à 15 % d'opacité) ; la vapeur, un émetteur par écran, 25 % au plus.
• Mouvement : 150 ms (survol, focus), 250 ms (carte, menu), 400 ms (apparition, engrenage). Avec prefers-reduced-motion, tout s'arrête.

Menus et lore

Les menus emploient les rôles ci-dessus. Le titre de fenêtre reste clair, jamais gris foncé : c'est le premier repère de navigation. Une lore de bouton suit toujours cet ordre : description (une phrase), séparateur, contenu (une ligne par donnée), séparateur, astuce d'interaction (Clic gauche > ...). Dans un menu, un objet est une image : dégâts, armure, durabilité et enchantements sont masqués, sauf là où le joueur peut retirer l'objet (sacs à dos, garde-robe).

Règles essentielles

• Le laiton est réservé aux boutons, onglets et cartes (sélection, focus, action principale). Dans un slot d'objet, le survol est le voile blanc vanilla : le laiton s'y confondrait avec Légendaire.
• La rareté se lit au coin : dans l'inventaire, un petit triangle de coin à la couleur de la rareté remplace les anciens contours.
• Jamais la couleur seule : un grade se lit par son insigne et son nom, l'information par son icône.
• Contrastes AA : 4,5:1 pour le texte courant, 3:1 pour le texte large et les éléments d'interface. Le cuivre, l'acier et le rubis en base n'atteignent pas 4,5:1 sur un panneau (#3B4252) : en petit texte, prendre le ton clair.
• Aucune couleur hors palette. Les anciennes dérives (cyan #88C0D0 en accent, #6BB0A8, #5CE0D6, bleu nuit et cuir en fond de site) disparaissent ; le site passe par des propriétés CSS, jamais par une couleur en dur.

Marqueurs de quêtes et types de PNJ

À réaligner sur la v2 : ces codes sont encore ceux de l'ancienne charte et sortent de la palette.

• Quêtes : identifiant <#FACADE>, marqueur étendu <#F0F81A>.
• PNJ : quêtes <#FFAE00>, décor <#00A6FF>, boutiques <#00FFB3>.

Récupérer la charte

Les quatre fichiers portent les mêmes valeurs que cette page.

• btc-charte-v2.json : jetons (rôles, grades, raretés, niveaux), pour les outils et les scripts.
• btc-charte-v2.css : propriétés personnalisées --btc-* à coller dans un site.
• btc-charte-v2.gpl : palette pour GIMP, Krita et Aseprite.
• btc-charte-v2-planche.svg : planche du nuancier (rôles, grades, raretés).

Voir aussi

• Directives de design — Autres directives de l'espace staff