Orfactor Agency Contact Form

Preview

Overview

The Orfactor Agency Contact Form ("Let's Make Problems Nervous.") is an editorial, high-conversion project inquiry interface tailored for creative studios, digital product agencies, and consultancies. Moving away from boxy input borders, it leverages clean underline baselines, italicized serif labels, and an interactive paper-plane vector illustration.

Key UI Features

1. Vibrant Emerald Backdrop & Dramatic Rounded Card:

   • High-energy spring green container (#2bd67b) housing an ultra-smooth rounded canvas (rounded-[40px] md:rounded-[48px]).
   • Clean spacing with generous padding allowing the editorial typography to breathe.

2. Editorial Typography & Line Art Illustration:

   • Punchy headline hierarchy (Let's Make Problems Nervous.) with tight tracking.
   • Handcrafted scalable vector illustration featuring a creator at a laptop with an expressive elongated arm launching a paper airplane.
   • Interactive launch micro-animation upon inquiry dispatch.

3. Minimalist Underline Input Styling:

   • Borderless text inputs with sleek bottom rules (border-b border-zinc-300 dark:border-zinc-700).
   • Italic serif placeholders (Full name*, Email*, Phone number, Company name, Project details*).
   • Custom Inquiry Reason* dropdown with downward arrow indicator (↓).

4. Budget Tier Selector Pills:

   • Quick-select horizontal pill chips with italic serif styling:
     • Less than $3K
     • $3K $5K
     • $5K $10K
     • $10K 20K
     • More than 20K

5. Direct Channel Inquiries Footer:

   • Three categorized contact avenues directly beneath the form:
     • Start a project → sales@orfactor.com
     • Partner with us → sales@orfactor.com
     • Work with us → career@orfactor.com