Contact Form

A two-column contact section with a header and contact details on one side and a validated name/email/message form in a card on the other, with built-in pending, success and error states.

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

import ContactForm from "@/components/ui/contact-form";

export default function ContactFormDemo() {
  return (
    <ContactForm
      onSubmit={async () => {
        await new Promise((resolve) => setTimeout(resolve, 1200));
      }}
    />
  );
}