rastrillo ডিজাইন সিস্টেম

ডিজাইন সিস্টেম যা কিছু দেয়, তার সংক্ষিপ্ত পরিচয়। থিম: day। ভাষা: বাংলা।

সব কম্পোনেন্টের জন্য সাধারণ কাস্টম প্রপার্টি। রং আর টাইপ থিমের অংশ (themes/day.css)। টাইপ স্কেল আর স্পেসিং ধাপ কাঠামো, আসে tokens.css থেকে।

এখানে লাইট মোড দেখানো হয়েছে; সব মান light-dark দিয়ে লেখা। WCAG 2.2 AA ন্যূনতম: টেক্সটে 4.5:1, কন্ট্রোল বর্ডারে 3:1। চিপ ইত্যাদির সব রং ভেরিয়েবল থেকে আসে।

পৃষ্ঠতল আর রেখা

• --rst-bg#ffffff
• --rst-header-rulecolor-mix(in oklab, var(--rst-accent) 18%, var(--rst-line))
• --rst-line#e5e7eb
• --rst-line-strong#7f8792
• --rst-surface#ffffff
• --rst-surface-2#f6f7f8

লেখা

• --rst-text#1a1d21
• --rst-text-faint#656c78
• --rst-text-muted#4b5563

উজ্জ্বল রং

• --rst-accent#2464e0
• --rst-accent-soft#eef3fe
• --rst-accent-strong#1a4fc0
• --rst-on-accent#ffffff

অবস্থার টোন

• --rst-tone-negative-bg#fee2e2
• --rst-tone-negative-fg#b91c1c
• --rst-tone-neutral-bg#eef0f2
• --rst-tone-neutral-fg#374151
• --rst-tone-positive-bg#dcfce7
• --rst-tone-positive-fg#166534
• --rst-tone-warning-bg#fef3c7
• --rst-tone-warning-fg#854d0e

গভীরতা

• --rst-overlayrgba(0, 0, 0, 0.45)
• --rst-shadow-knob0 1px 2px rgba(0, 0, 0, 0.3)
• --rst-shadow-lift0 1px 2px rgba(0, 0, 0, 0.08)
• --rst-shadow-pop0 8px 24px light-dark(rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.5))

কোণের ব্যাসার্ধ

• --rst-radius8px
• --rst-radius-pill999px
• --rst-radius-sm6px

টাইপ ফ্যামিলি

• --rst-fontsystem-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif

টাইপ স্কেল

• Ag--rst-fs-base0.875rem
• Ag--rst-fs-lg1.0625rem
• Ag--rst-fs-sm0.78125rem
• Ag--rst-fs-xs0.71875rem

ফাঁক

• --rst-sp-10.25rem
• --rst-sp-20.5rem
• --rst-sp-30.75rem
• --rst-sp-41rem
• --rst-sp-51.5rem
• --rst-sp-62.5rem