Smart Draw System Theme
The official design system for the Ministry's Smart Draw platform. A synthesis of governmental authority and modern interface precision.
Core Palette
Our primary blue represents stability and authority, while the gold foil accent provides a layer of prestige.
Institutional Blue
#1F41BB
Luxury Gold
#DFB173
System Success
#059669
System Critical
#DC2626
Typography
H1 Title
Dynamic Dashboard
Body Text
Professional typography for maximum readability.
Grid & Spacing
Our spatial system is based on a refined 8px grid, prioritizing negative space to reduce cognitive load.
Layout Containers
6 Columns
6 Columns
Use .row.g-4 for standard content grouping.
Buttons
Form Elements
Clean, accessible form controls with premium focus states.
Text Inputs
Select & Toggle
Enable Notifications
Badges & Status
Semantic indicators used for approvals, states, and categories.
Status Indicators
Active
Approved
Pending
In Review
Cancelled
Completed
<span class="badge-status badge-active">Active</span> <span class="badge-status badge-pending">Pending</span>
Cards & Metrics
The primary building blocks for data visualization and grouping.
38
Total Companies
12.4K
Total Users
24
Active Draws
Alerts & SweetAlert
Standard Alerts
Success
message toast style.
Error
or restriction alert.
SweetAlert Triggers
Modals
Dialogs
<div class="modal fade" id="myModal">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">...</div>
</div>
</div>
Tables (FooTable)
| Entity | Identifier | Status | Action |
|---|---|---|---|
|
Al-Ghanem Trading
|
CR 192834 | Active |