Ciprian Titire

FAQ Drawer

Component

About

An FAQ as a card-index drawer. Each question is typed along a card's edge with its subject on a staggered tab, and pulling one lifts it out of the drawer to show the answer, as a native details disclosure with no layout measuring. Aluminium or graphite drawer, paper cards in both. MIT. More like it: tactileui.dev

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds FAQ Drawer to your project and fits it to your theme.

Code

How FAQ Drawer is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import { FaqDrawer } from "@/components/ui/faq-drawer";

export default function FaqDrawerDemo() {
  return (
    <div style={{ width: "100%", minHeight: "100vh", boxSizing: "border-box", display: "flex", alignItems: "center", justifyContent: "center" }}>
      <FaqDrawer style={{ flex: 1 }} />
    </div>
  );
}

More by Ciprian Titire

View all
  • Compass

    Compass

  • Engraved Client Plates

    Engraved Client Plates

  • Pull Cord Lamp

    Pull Cord Lamp

  • Machined Footer

    Machined Footer

  • Mechanical Odometer

    Mechanical Odometer