Control look, layout, spacing, and motion. The preview includes a mobile device view on this tab so you can check responsive layout and icon sizes.
Theme
Pick a visual style for the badge set.
- Theme preset — Applies background, typography, and accent styling. Each option shows color swatches.
- Customize theme colors — Fine-tune background, accent, and corner radius (0–32px). Reset per theme or all at once.
- Padding & margin — Adjust inner spacing and vertical space above/below the badge set (0–48px).
- Icon alignment — Left, center, or right.
- Layout style — How heading, text, and icons are arranged (see table below).
Free: 5 theme presets plus Custom Color.
Pro: All 21 theme presets plus Custom Color.
| Layout | Best for |
|---|---|
| Inline row | Heading and text above icons in a horizontal row (default) |
| Stacked | Icons in a vertical column |
| Grid | Icons in a responsive multi-column grid |
| Split | Text on the left, icons on the right |
| Centered | Heading, text, and icons centered as a stack |
| Compact | Dense horizontal row with tight spacing |
| Minimal | Compact layout with lighter typography |
Free: Inline row, Stacked, Grid.
Pro: All 7 layout styles.
Heading & text styling
Separate controls for heading and body text:
- Size (10–48px)
- Alignment (left, center, right)
- Color (color picker)
These apply on top of any theme preset.
Icon size
- Desktop — Icon size on larger screens (16–128px).
- Mobile — Icon size on small screens (16–128px).
Use the mobile preview to confirm icons look right on phones.
Animation
Choose an entrance animation for the badge set. Each option shows a live preview in the dropdown.
Free: None, Fade in, Fade up.
Pro: All 23 animation presets (slide, zoom, bounce, pulse, glow, and more).
Animations respect the visitor’s reduced motion preference.