Shadcn Contact Block Six
Shadcn Contact Block Six is the office-locator variant in this group. The source defines three demo offices: San Francisco, London, and Singapore, each with a country, address, timezone, and Unsplash image. The left column adds email, worldwide availability, and a Get in touch button.
Those locations and images are placeholders. They make the layout concrete, but production use should replace them with real office data, accessible image choices, and correct time zone labels.
Office Cards
Each office renders inside a shadcn Card with an image header, city and country, address text, and a clock row for timezone. The image uses next/image with fill, object cover, and a hover scale transition.
Responsive Behavior
The main grid switches at @3xl:grid-cols-[1fr_2fr], while the office list uses @md:grid-cols-3. That keeps the intro readable on mobile and turns the office cards into a compact row when space allows.
Customization Notes
Use this contact section when physical presence matters: agencies, enterprise SaaS teams, events, regional sales, or support offices. If your company is remote-only, keep the left column and replace the office cards with region-based contact owners or support hours.
Frequently Asked Questions
Does the block include a map?
No. The source uses image cards, not an embedded map. Add map links or directions only if you have verified destinations.
What should be changed first?
Replace office names, addresses, images, timezone labels, and the #contact-form target.
Related Shadcn UI Blocks
Start from Tailark
Build with Tailark
Production-ready marketing blocks, pages, and illustrations for Shadcn UI.