# Topic Contact Form block

> Frameless split contact form with topic Select and image-backed Card panel of email and phone links

Split contact-us section: frameless form (Name, Email, topic Select, Subject, Textarea) beside an image-backed Card of email and phone links. Field, Input, Select, Textarea, Button, Card, Item. Contact page, support form, sales inquiry, lead capture.

- Type: Pro block
- Category: [Contact](https://web.dev.reui.io/blocks/marketing/contact.md)
- Page: https://web.dev.reui.io/blocks/marketing/contact/contact-3
- MCP: `get_block("contact-3")`
- Built with: Badge, Button, Card, Field, Input, Item, Select, Textarea
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

A general message routed by topic, from product questions to licensing, partnerships and press, beside a photo panel

## Agent notes

- `CONTACT_TOPICS` lists 5 sample topics and `CONTACT_PANEL_IMAGE` is a hotlinked Unsplash photo; replace both with your own
- `CONTACT_PANEL.details` carries a fictional 555 phone number with a tel link beside the demo email; swap or drop it
- The Topic `Select` is uncontrolled and `contact-3-form` has no submit handler, so nothing routes by `CONTACT_TOPICS` until you add it

## When not to use

- A one-address support page where visitors email directly and no form is wanted: use [Single Email Contact](https://web.dev.reui.io/blocks/marketing/contact/contact-1.md) (`get_block("contact-1")`)

## Install

```bash
npx shadcn@latest add @reui/contact-3
```

## About Contact blocks

### When to use

- A contact us or support page that sends visitors to email, phone, live chat or a community
- A project, sales or support inquiry form set beside a panel with the team's email
- A find us section listing office addresses, timezones, business hours and directions links

### When not to use

- A person's details tile in a product, such as an applicant with copyable phone and email: use the [Card blocks](https://web.dev.reui.io/blocks/application/card.md)
- Record entry or editing inside a product, such as an invoice, a member invite or a ticket: use the [Form blocks](https://web.dev.reui.io/blocks/application/form.md)
- A closing banner that asks for a newsletter signup or a sales call, not a written message: use the [CTA blocks](https://web.dev.reui.io/blocks/marketing/cta.md)

### Agent notes

- Every block centers itself in a `min-h-svh` wrapper with its own padding and max width; strip it when stacking the section in a landing page
- Every block hardcodes a ReUI demo inbox such as `hello@reui.io` or `studio@reui.example`; set your own address in its data or component file
- Every `Button` lacks a handler and a real target, and no block is a client component; wire the submit and link actions yourself

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.