الألوان والرموز

import"@truvar-ai/design-system/tokens"

الكحلي يحمل الهوية والذهبي يميز لحظة القيمة. كل المكونات تقرأ هذه الرموز، فتأتي الأوضاع الفاتحة والداكنة وأي أوضاع مستقبلية دون جهد إضافي.

رموز الألوان

مبني على tokens.css

العينات تعرض الوضع الحالي. القيم: الفاتح ثم الداكن.

navy-900#001250لون الهوية الأساسي: الشعار والمساحات الكبيرة

gold-300#e0b96aلون الإبراز على الكحلي والخلفيات الداكنة

primary#001250 / #e0b96aالأزرار الأساسية والحالات المحددة

accent#916625 / #e0b96aالروابط ونصوص الإبراز

surface#ffffff / #131416خلفية الصفحة

surface-alt#f7f5f0 / #1c1d20الأقسام واللوحات ورؤوس الجداول

surface-raised#ffffff / #232428القوائم والنوافذ واللوحات الجانبية

ink#001250 / #ebe9e4النصوص

ink-muted#4a5578 / #a5a39dالنصوص الثانوية

border#d9dce6 / #2d2e32الخطوط الفاصلة

border-strong#6b7494 / #76777dحدود عناصر التحكم

success#1f6f4a / #6fd3a0النجاح، مع كلمة أو أيقونة

warning#9a5b00 / #f2b45aالتحذيرات، مع كلمة أو أيقونة

danger#b3261e / #ff8a80الأخطاء، مع كلمة أو أيقونة

مبني على --space-*

مقياس مبني على ٤ بكسل. البطاقات تستخدم space-6 داخليًا، والأقسام بينها space-16.

space-14px

space-28px

space-312px

space-416px

space-624px

space-1040px

space-1664px

مبني على --radius-*, --shadow-card

حواف دائرية مثل الشعار. الظلال فقط للعناصر الطافية.

radius-sm

radius-md

radius-lg

radius-pill

shadow-card