Contact 02
NewA centred minimal form with a Sales / Support / Something else segmented control that changes the fields: company size for Sales, account email and urgency for Support.
Installation
pnpm dlx shadcn@latest add https://kagadmodyaa.vercel.app/r/contact-02.jsonNeeds a React + Tailwind project set up with shadcn. Copies the block's files into your project, along with the components it uses, so you can edit all of it.
Usage
This block is a section, not a page. Import it where you want it, alongside your other sections.
import { Contact02 } from '@/components/contact-02/contact-02'
export default function Page() {
return (
<main>
<Contact02 />
</main>
)
}Files
What the command adds to your project, and where.
components/contact-02/contact-02.tsxThe section. Import it into any page and render it; it fills the width of its parent.
It also installs the components it is built from, unless you already have them: Button, Input, Label, Radio Group, Select, Spinner, Textarea, Toggle Group.
Links, copy and the product name are placeholders; swap in your own. Where a block has a form, its submit handler is a stub for your own request.
More in Contact
- Contact 01A split contact section: email, phone and office address in text on the left, a validated form with a topic Select and consent checkbox on the right, with sending and success states.
- Contact 03Three office cards, each with a drawn city map and pin, the address, a live local time and open status (computed after mount), plus a general enquiries line.
- Contact 04A book-a-demo section: value points on the left; on the right a three-step scheduler with our Calendar, a time-slot grid, a time zone Select, a details form and a confirmation summary.