About this block

Fade In Content Accordion is a single-column accordion list. Each row shows a question as a trigger, and when a reader opens it the answer slides up from below while fading in over half a second. The items are separated by thin bottom borders, and only one panel can be open at a time so the list stays compact.

The copy in each trigger and answer is fully replaceable, and you can add or remove items freely. The fade and slide animation applies to every panel automatically, so no per-item setup is needed. The block has no heading or supporting text, so it drops cleanly into any surrounding layout.

When to use

This block suits an FAQ section on a healthcare scheduling product where patients and caregivers arrive with specific questions and need clear, calm answers. The gentle fade draws attention to the opened answer without jarring the reader, which fits a context where trust and clarity matter. Compared to a plain accordion with no entrance animation, the fade gives each revealed answer a moment of focus that reduces the feeling of content suddenly snapping into view.

A natural flow around it on a Components page:

Before

• A short introductory section or hero to set the page context
• Cards to surface the key service or feature categories before readers reach the detail questions

After

• Alerts for a notice or call to action once readers have scanned the FAQ
• Buttons to route readers toward booking or a contact form

What you can display

Any set of question and answer pairs where the answer benefits from a calm, unhurried reveal. A few fits beyond the obvious FAQ:

• Patient intake questions. List common pre-appointment questions with concise answers so patients feel prepared before they arrive.
• Insurance and billing clarifications. Walk through coverage and payment steps in plain language so readers find answers without calling support.
• Post-visit instructions. Present after-care steps as short answers that readers can open one at a time without feeling overwhelmed.

Tip: keep each answer to two or three sentences so the fade animation completes before the reader finishes reading the first line.