FAQ
flx/accordion-04FreeBlock
A titled question-and-answer list.
Install it
npx shadcn@latest add https://ui.flexnative.com/r/accordion-04.jsonSource
1import {2 Accordion,3 AccordionContent,4 AccordionItem,5 AccordionTrigger,6} from '@/components/ui/accordion'78const faqs = [9 {10 q: 'Can I cancel my subscription anytime?',11 a: 'Yes. Your plan stays active until the end of the current billing period, and you keep full access until then.',12 },13 {14 q: 'Do you offer refunds?',15 a: 'We refund unused time on annual plans within 30 days of purchase. Monthly plans are non-refundable.',16 },17 {18 q: 'Can I switch plans later?',19 a: 'Absolutely — upgrade or downgrade at any time. Changes are prorated against your next invoice.',20 },21 {22 q: 'Is there a free trial?',23 a: 'Every plan includes a 14-day free trial. No credit card is required to start.',24 },25]2627export function Accordion04() {28 return (29 <div className="w-full max-w-xl">30 <h3 className="mb-4 text-lg font-semibold">Frequently asked questions</h3>31 <Accordion>32 {faqs.map((faq, index) => (33 <AccordionItem key={faq.q} value={`faq-${index}`}>34 <AccordionTrigger>{faq.q}</AccordionTrigger>35 <AccordionContent className="text-muted-foreground leading-relaxed">36 {faq.a}37 </AccordionContent>38 </AccordionItem>39 ))}40 </Accordion>41 </div>42 )43}
What it pulls in
Other registry items
Files it writes
More from flx
All 450 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| Basicaccordion-01 | flx | Blocks | Free | no deps | |
| Multipleaccordion-02 | flx | Blocks | Free | no deps | |
| With iconsaccordion-03 | flx | Blocks | Free | no deps | |
| Separated cardsaccordion-05 | flx | Blocks | Free | no deps | |
| Plus / minus iconaccordion-06 | flx | Blocks | Free | 1 dep | |
| Left chevronaccordion-07 | flx | Blocks | Free | 1 dep | |
| Rich contentaccordion-09 | flx | Blocks | Free | no deps | |
| Disabled itemaccordion-10 | flx | Blocks | Free | no deps |
