Accordion FAQ — Editorial Variant
Accordion rows in an editorial register — atmospheric type, generous spacing, slower reveals — pilots a tarot-themed reference but the pattern fits any contemplative, mystical, or premium-feel content list.
Best for: Glossaries, reference lessons, and FAQ-style content for premium, editorial, or contemplative brands where scannable rows still need to feel intentional and slow.
Live preview — scroll inside the frame to see the full page.
What it does
- Click-to-expand rows — each row's title bar opens to reveal a long-form answer underneath, with a smooth height-grow animation
- One open at a time — opening a new row gracefully closes the previously open one, keeping the page tidy
- Editorial spacing and typography — generous padding, larger title type, and slower reveal pacing make each interaction feel intentional
- Atmospheric indicator — a soft chevron or ornament rotates as the row opens, in keeping with the premium register
- Scannable list, deep on demand — the closed state stays scannable like a table of contents; the open state reads like an essay
Best use cases
- Esoteric and contemplative work — tarot meanings, runes, archetypes, dream symbols
- Wellness and spiritual coaching — chakras, doshas, types/temperaments, mantras
- Premium course content — case-study indexes, named principles, signature framework definitions
- Editorial brands — author glossaries, terminology indexes, slow-reading reference content
- Membership reference libraries — anywhere reading should feel deliberate rather than transactional
What you can change with your DNA
When you run this through the remix skill, your CCOS DNA — brand, voice, audience — drives these decisions automatically:
- Colors — slots for page background, row background, divider lines, title text, body text, and the indicator. Lean toward muted, atmospheric palettes for the editorial feel.
- Fonts — two roles: a display or italic serif for the row titles, and a body font for the expanded answers. The serif is what makes this variant editorial.
- Copy — each row has a concept name or question as the title and a long-form answer beneath. Works best with 8-22 rows of named-concept content.
- Images — none by default. Optional: small ornaments or pull-quote treatments inside expanded answers reinforce the editorial register.
- Behavior — choose whether one row opens at a time or multiple, and tune the open/close animation speed for a slower, more contemplative reveal
How remixing works
From "swiped it" to "shipped it" in three steps.
Pick a remix
Browse the library, find one that fits — like this one.
Run it through your DNA
The remix skill uses your CCOS DNA to swap colors, fonts, copy, and structure so it lands as yours.
Ship it
Paste the finished HTML into Thinkific, Kajabi, WordPress, or any platform that takes embed code.
Create a new list
Save your favorites
Email me a magic link and I'll add this to your favorites list.