Accordion Component
FAQ example
Multiple items in .accordion-group
Each AccordionItem is independently expandable.
Yes, you can try us for free for 30 days. If you want, we'll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.
Of course. Our pricing scales with your company. Chat to our friendly team to find a solution that works for you.
We understand that things change. You can cancel your plan at any time and we'll refund you the difference already paid.
Yes, you can contact us at any time and we'll be happy to help you with your invoice.
Plans are per workspace, not per account. You can upgrade one workspace, and still have any number of free workspaces.
You can change the email address associated with your account by going to untitledui.com/account from a laptop or desktop.
razor
<div class="accordion-group">
<AccordionItem Title="Is there a free trial available?" @bind-IsOpen="faq1Open">
Yes, you can try us for free for 30 days.
</AccordionItem>
<AccordionItem Title="Can I change my plan later?" @bind-IsOpen="faq2Open">
Of course. Our pricing scales with your company.
</AccordionItem>
<AccordionItem Title="What is your cancellation policy?" @bind-IsOpen="faq3Open">
You can cancel your plan at any time.
</AccordionItem>
</div>
@code {
private bool faq1Open = true;
private bool faq2Open;
private bool faq3Open;
}Open by default
IsOpen="true" sets the initial state
Yes, you can try us for free for 30 days. If you want, we'll provide you with a free, personalized 30-minute onboarding call to get you up and running as soon as possible.
razor
<div class="accordion-group">
<AccordionItem Title="Is there a free trial available?" IsOpen="true">
Yes, you can try us for free for 30 days.
</AccordionItem>
</div>Collapsed single item
Uncontrolled state
Yes, you can try us for free for 30 days.
razor
<div class="accordion-group">
<AccordionItem Title="Is there a free trial available?">
Yes, you can try us for free for 30 days.
</AccordionItem>
</div>