Contact Form Grid With Details
The left column displays a mail icon in a styled container, heading, description, and contact details (email, phone, support email). Below that, a world map SVG renders with CSS perspective transform at 45 degrees, creating a tilted 3D effect. An animated Pin component marks a location on the map.
The right column contains the contact form with a dotted grid background pattern. Form fields include name, email, company, budget dropdown, and message textarea. Each input uses focus ring styling and the form has a gradient background from gray-100 to gray-200 in light mode.
The grid pattern is generated using a reusable Grid component that creates an SVG with circular dots. The component accepts a size prop to control dot spacing.
Useful for SaaS companies, consulting firms, agencies, and any business with a global presence that wants to communicate geographic reach.
Explore more
Part of Contact Sections ยท All blocks
Build websites faster and 10x better than your competitors with
Aceternity UI Pro
Next.js 15, Tailwind CSS v4 and Motion for react powered templates
100+ templates and blocks combined
Ready to copy paste component blocks, save days of development time



