Refaq Workforce — Design System
Tailwind + shadcn/ui · tokens from Figma · EN · Light
Colors
Brand & status
brand-main
#82FF35
brand-secondary
#1C6AFF
green / success
#53D901
orange / warning
#FF7918
error / danger
#F61D00
Cian
#37C2C2
Black
black-main
#10100F
black-secondary
#1B1B1A
black-third
#2D2D2B
Background & lines
bg-main
#F8F8F3
bg-secondary
#F3F3EC
bg-third
#EAEADD
line
#DCDCD9
Typography — Inter / Noto Sans Arabic
Display 48
Heading 1 — 36
Heading 2 — 28
Heading 3 — 22
Body p18 — Refaq turns expert knowledge into measurable readiness.
Body p16 — secondary text.
نص عربي — ريفاق تحوّل خبرة الموظفين إلى جاهزية قابلة للقياس.
Buttons
Badges, personas & statuses
BrandApprovedPending reviewAt riskInfoMentorMenteeOutline
Forms
Cohort modules (preview)
Competency heatmap
Recurring capability gaps across the cohort
Safety & compliance
88%low
Design review fundamentals
72%medium
Project documentation
44%high
Client-ready communication
39%high