Components
Loading preview...
Pixel-art accordion from 8bitcn.com — expandable panels with retro chunky dashed borders. Native primitive rewrite, no Radix.
npx shadcn@latest add https://21st.dev/r/theorcdev/8bit-accordion"use client";
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/8bit-accordion";
export default function Default() {
return (
<div className="flex w-full min-h-screen items-center justify-center bg-background p-8 overflow-hidden">
<Accordion type="single" collapsible className="w-full max-w-sm">
<AccordionItem value="item-1">
<AccordionTrigger className="font-pixel">Quest Log</AccordionTrigger>
<AccordionContent className="font-pixel">
Defeat the Dungeon Master to claim the legendary sword.
</AccordionContent>
</AccordionItem>
<AccordionItem value="item-2">
<AccordionTrigger className="font-pixel">Inventory</AccordionTrigger>
<AccordionContent className="font-pixel">
Potion ×3, Elixir ×1, Phoenix Down ×2
</AccordionContent>
</AccordionItem>
<AccordionItem value="item-3">
<AccordionTrigger className="font-pixel">Party</AccordionTrigger>
<AccordionContent className="font-pixel">
Warrior, Mage, Rogue
</AccordionContent>
</AccordionItem>
</Accordion>
</div>
);
}