Data Table
A sortable data table with proper contrast, typography, and accessibility features.
Critical Rules Demonstrated
-
A11Y-001View Rule Details → -
TYPO-001View Rule Details →
Live Example
|
Name
|
Status
|
Role
| Last Active | Actions |
|---|---|---|---|---|
| SM Sarah Mitchell sarah@example.com | Active | Administrator | 2 hours ago | |
| JC James Chen james@example.com | Active | Developer | 5 minutes ago | |
| EP Emma Parker emma@example.com | Inactive | Designer | 3 days ago | |
| MJ Michael Johnson michael@example.com | Pending | Manager | 1 week ago |
Brand Rules Applied
- A11Y-001: All text maintains 4.5:1+ contrast ratio - Navy (#17232D) on white/pale-blue backgrounds
- TYPO-001: Body text uses Montserrat at appropriate sizes (14px minimum)