🎨 Mock App Theme
🔷 Primary
💚 Secondary
📄 Background
📦 Surface
✍️ Text
🧵 Border
ℹ️ Info Badge
✨ Mock App Presets
🌿 Default
🌙 Dark Matter
🌊 Ocean Drift
🌅 Sunset Glow
🍃 Forest Canopy
🌸 Soft Light
🌙 Soft Dark (Blue)
⟳ Reset
📋 CSS Live Preview
📦 Export / Import
📋 Copy CSS
💾 Export JSON
📂 Import JSON
Copy CSS variables or export/import theme as JSON
🖥️ Interface theme
☀️ Light
🌙 Dark
🌓 Auto
⚡ Left panel = main interface theme
🎨 Right preview = independent mock app theme
📌 ChromaForge · v1.8.0
(live CSS preview, preset dropdown, info‑badge token)
✦ AETHERUI
Dashboard
Components
Playground
🌿 Thematic abstraction
Colors reshape the mood. This entire UI responds to your custom variables — primary, secondary, surface, border and text.
Explore
Palette
#chroma
themeable
css vars
🎛️ Dynamic control
Email address
Feedback / role
Theme explorer
UI artist
Developer
Subscribe to inspiration
📊 Theme engagement
Harmony score
78%
Contrast ratio
dynamic
⬤
Primary
⬤
Secondary
⬤
Info Badge
🎨 Color tokens in action
Primary & secondary appear on buttons, badges, progress bars, and links — all driven by your theme variables.
Neutral
Primary action
Secondary action
✦ Mock app theme is independent from main interface.
🧩 UI Components Library
Explore themed components that react to your color variables.
Default
Primary
Secondary
Slider (themed)
Chip One
Chip Two
Themed Border
📋 Progress Bars
Primary progress
64%
Secondary progress
33%
🎮 Interactive Playground
Try live theming with dynamic counters and color mixing.
Click me
0
Random fill (themed)
0%
Randomize
✨ All interactive elements adapt to current theme.