General UI Component
Highly reusable badges, soft tags, pagination, status indicators, and breadcrumbs.
Badges & Status Tags
Contextual badges, soft translucent pills, outline styles, and live status dots.
Solid & Theme Badges
Dark Forest
Lime Accent
Primary
Success
Danger
Warning
Info
Soft Translucent Badges
Soft Forest
Soft Lime
Soft Primary
Soft Success
Soft Warning
Soft Danger
Outline & Rounded Pill Badges
Forest Pill
Lime Pill
Primary Pill
Success Pill
Danger Pill
Positioned Badges & Live Status Dots
Online
Away
Busy
Navigation & Loading Indicators
Multi-page pagination links, breadcrumbs, and spinner loading states.
Default Pagination
Rounded Pagination (`.pagination-rounded`)
Breadcrumb Hierarchies
Spinners & Loading Buttons
Loading...
Loading...
Loading...
Headings with Badges (Typography)
Badges scale to match the font size of parent heading elements using relative sizing.
h1. Example heading New
h2. Example heading New
h3. Example heading New
h4. Example heading Info Soft
h5. Example heading New
h6. Example heading New
Inline Text & Lead Paragraphs
Styling options for body copy, lead text, highlights, and inline text decorations.
Spark Admin features modern Plus Jakarta Sans typography with tailored weights.
You can use mark element to highlight text, deleted text, underlined text, and bold text effortlessly.
"Simplicity is about subtracting the obvious and adding the meaningful."
John Maeda in The Laws of Simplicity