← All blocks

Contact details beside a form

contact · info-beside-form · contact-form-split

npx shadcn@latest add @plus-ui/contact-form-split

Default content

{
  "eyebrow": "Start a project",
  "title": "Tell us what you're building",
  "description": "We take on four projects at a time. Share a few lines about your product and timeline, and a designer — not a salesperson — will reply.",
  "channels": [
    {
      "label": "New projects",
      "email": "[email protected]",
      "note": "Inês and Joris read these"
    },
    {
      "label": "Press and talks",
      "email": "[email protected]"
    },
    {
      "label": "Careers",
      "email": "[email protected]"
    }
  ],
  "details": [
    {
      "label": "Response time",
      "value": "Within two working days"
    },
    {
      "label": "Next availability",
      "value": "Projects starting March 2027"
    }
  ],
  "localTimeLabel": "Local time",
  "offices": [
    {
      "city": "Lisbon",
      "country": "Portugal",
      "address": [
        "Rua da Boavista 84, 2º",
        "1200-066 Lisboa"
      ],
      "timeZone": "Europe/Lisbon",
      "phone": "+351 21 340 1872",
      "email": "[email protected]",
      "image": {
        "src": "https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=800&h=600&q=80",
        "alt": "The Lisbon studio: long shared desks under tall windows"
      }
    }
  ],
  "form": {
    "name": {
      "label": "Your name",
      "placeholder": "Ana Ribeiro"
    },
    "email": {
      "label": "Work email",
      "placeholder": "[email protected]",
      "helper": "We reply from a real inbox, never a mailing list."
    },
    "company": {
      "label": "Company",
      "placeholder": "Company or product name"
    },
    "topic": {
      "label": "What do you need?",
      "placeholder": "Choose a type of project",
      "options": [
        "A new product, from zero to launch",
        "Redesign of a live product",
        "A design system",
        "An ongoing design partnership",
        "Something else"
      ]
    },
    "message": {
      "label": "About the project",
      "placeholder": "What are you building, who is it for, and when would you like to launch?",
      "helper": "A few sentences is plenty. Links to decks or prototypes welcome."
    },
    "submitLabel": "Send to the studio",
    "note": "We only use your details to reply to this message."
  }
}