Skip to main content

Components — Theme Settings mapping

Theme Settings → Components · storage key button_presets · box_presets · text_styles · theme_colors · image_styles · section_style_presets · …

Components is where the converter reproduces the source’s design system most heavily. It’s a single Theme Settings tab, but it holds many preset libraries — buttons, boxes, text styles, colours, badges, image styles, section skins, spacing — and the converter derives almost all of them from the captured DOM + computed styles, writing each as a fully-editable addable-box (not baked CSS).

Coverage​

68/91 derived from the source (75%) across 11 preset libraries — 🟡 0 via CSS · ⚪ 23 default/manual · ⚙️ 14 auto.

Preset libraryCoverageDerivedFull reference
Buttons✅ Populated✅ 18 native · 72%reference
Box Presets✅ Populated✅ 11 native · 85%reference
Text Styles✅ Populated✅ 7 native · 88%reference
Color Presets✅ Populated✅ 1 native · 100%reference
Icon Badges✅ Populated✅ 10 native · 71%reference
Image Styles✅ Populated✅ 5 native · 56%reference
Section Styles✅ Populated✅ 6 native · 75%reference
Container Widths✅ Populated✅ 2 native · 100%reference
Background Patterns✅ Populated✅ 4 native · 100%reference
Spacing✅ Populated✅ 2 native · 100%reference
Gaps✅ Populated✅ 2 native · 40%reference

These presets are what the converted elements then consume — a button points at a derived Button preset, a card at a derived Box preset, a heading at a derived Text Style — so editing one preset restyles every element that uses it, site-wide. Each library below has its own page here (what the converter fills) and a full reference under The Theme → Components (how it’s coded + examples).

Status legend​

  • ✅ Native — Derived and written from a source signal.
  • 🟡 Via CSS — Reproduced via generated CSS; the native option is left empty (candidate to promote).
  • ⚪ Unmapped — Left at default — no source signal, or set by hand.
  • ⚙️ Auto — Plumbing. Excluded from the coverage percentage.

← Back to Theme Settings Mapping