Skip to main content
Les outils du design system donnent aux designers, développeurs et créateurs de contenu un accès instantané à l’identité visuelle et à la bibliothèque de composants ColisMove.

​
Vue d’ensemble des outils

get_brand_guidelines

Identité de marque, traits de personnalité, ton de voix et registre de communication par contexte.

get_design_tokens

Système de couleurs OKLCH, typographie (Inter/Geist), échelle de border radius et animations CSS.

get_component_catalog

63 composants répartis sur 6 catégories — filtrables par catégorie (base, form, navigation, feedback, data, business).

get_visual_style

Philosophie des coins arrondis, ombres, glassmorphism, effets de glow et micro-interactions.

get_color_palette

Palette complète hex + OKLCH pour les modes clair et sombre, tokens de sidebar et couleurs de statut.

​
Exemples de conversations

Vous demandez :
Je conçois un email marketing pour ColisMove. Quelles couleurs et quel ton dois-je utiliser ?
L’IA appelle get_brand_guidelines et get_color_palette pour vous donner :
  • L’orange primaire #E85A2A pour les CTAs
  • La personnalité de marque : accessible, fiable, moderne
  • Le ton : chaleureux et rassurant, éviter le jargon
  • Des exemples « dit » vs « ne dit pas »
Vous demandez :
Je dois construire une page de comparaison de tarifs. Quels composants utiliser ?
L’IA appelle get_component_catalog avec les catégories « data » et « base » pour recommander :
  • Cards pour les paliers de tarif
  • Badges pour les libellés de plan
  • Boutons avec variantes primary/secondary
  • Animations disponibles pour les effets de hover
Vous demandez :
Quelle est la couleur de fond en dark mode ?
L’IA appelle get_color_palette et renvoie les valeurs OKLCH et hex exactes pour les tokens du mode sombre.

​
Catégories de composants

CatégorieNombreExemples
Base14Button, Card, Badge, Avatar, Separator
Form17Input, Select, Checkbox, DatePicker, Slider
Navigation9Sidebar, Tabs, Breadcrumb, Pagination
Feedback7Alert, Toast, Dialog, Progress, Skeleton
Data5Table, Chart, Calendar, DataTable, Timeline
Business10AnnouncementCard, BookingTimeline, KYCBadge, WalletCard
Appelez get_component_catalog avec une catégorie précise pour obtenir les specs détaillées des composants, y compris les variantes, tailles et états.