ANALYTICS BY SUFYAAN STUDIO — DESIGN SYSTEM
Design System Primitives & Tokens
BACK TO HOME
01 // Brand & Surface Colors
PRIMARY
#000000
ACCENT MINT
#c8f6f9
PERIWINKLE
#bdbbff
CANVAS DARK
#010120
DARK SOFT
#26263a
DARK FILL
#313641
02 // Button Inventory (Exact Variants)
BUTTON PRIMARY
SECONDARY MINT
SECONDARY WHITE
BUTTON OUTLINE
GHOST ON DARK
03 // Inputs, Toggles & Tabs
WEBSITE DOMAIN
Enter domain without protocol
Public share link
Respect DNT
TOGGLE PILL GROUP
24H
7D
30D
90D
FEATURE TAB PILL
Overview
Performance
Security
04 // Badges, Trends & Progress Bars
Live Pulse Dot
Neutral Badge
↑
+14.2%
↓
-3.8%
Subtle on Dark
SEGMENTED PROGRESS BAR
Desktop:
65.0%
Mobile:
30.0%
Tablet:
5.0%
05 // Stats Cards (Tinted & Plain)
UNIQUE VISITORS
48.2k
+12.4% vs last mo
PAGEVIEWS
142.8k
+8.2% vs last mo
BOUNCE RATE
32.4%
482 single views
AVG DURATION
2m 45s
12.4k sessions
06 // uPlot Timeseries Chart
TRAFFIC DEMO
Sample timeseries visualization
07 // Data Table with Proportional Fill
PAGE PATH
VIEWS
VISITORS
/ (Home page)
12,480
8,920
/pricing
7,488
5,350
/docs/quickstart
4,368
3,120