Surfaces
Base, raised, inset, and pressed surfaces in one material.
Tactile surfaces, large radii, and soft shadows
Base, raised, inset, and pressed surfaces in one material.
The same shapes across depth levels without harsh borders.
Quiet system icons with accent only where state needs it.
Shape is created with radius and shadow, not hard borders.
One component set works in both themes through tokens.
Core interactive states
Raised by default, softly pressed in active states.
Fields stay inset, while focus and error use accent treatment.
Check, radio, switch, and slider from the same tactile system.
Status, period, and date selection inside the same inset logic.
Navigation, context, and flow
Soft local navigation without extra visual noise.
Secondary navigation and quick page movement.
Stepper for setup, onboarding, and sequential actions.
Assembled application workspace
A production-like screen, not only an atom gallery.
Quiet right-side panel for details, statuses, and secondary actions.
Cards, tables, lists, statuses
Raised cards for entities and summary blocks.
Dense but soft list rows for apps and dashboard UI.
Statuses and compact elements in the same material.
Table rows for operational lists, filters, and statuses.
Mini chart widgets for dashboard and analytics panels.
Non-blocking and blocking feedback
Action confirmation inside the same soft system.
Are you sure you want to continue?
Soft notifications and long-running operations.
Warnings, loading, and empty states.