Shadcn UI Contact Block
Contact16 is a dark-themed two-column layout. The left side has an oversized headline with a superscript asterisk, a paragraph of muted description text, and inline phone and email links with small icons. The right side contains a form with three borderless inputs (name, email, message) that use only a bottom border, and a ghost-style submit button with a corner arrow icon.
Forces dark mode with a solid dark background and light text. The headline is extremely large on desktop. Input fields have no background or side borders, only a subtle bottom line that highlights the text. Placeholder text is very muted. The ghost button aligns left with an icon, creating an unconventional but intentional alignment.
Bold and editorial with a portfolio or agency feel. The oversized typography and minimal input styling create a high-contrast, confident aesthetic. The dark theme and stripped-down form inputs feel artistic rather than corporate. Works best for creative businesses or personal portfolios.
Dependencies
| Package | Type |
|---|---|
| @hookform/resolvers | NPM |
| lucide-react | NPM |
| react | NPM |
| react-hook-form | NPM |
| zod | NPM |
button @shadcn | Registry |
field @shadcn | Registry |
input @shadcn | Registry |