Home
Ho O
Visit us section with google map

Visit us section with google map

Forked from> @santos78/visit-us-section-with-google-map

useful for landing pages uses fabform.io

This tailwind example is contributed by Ho O, on 08-Jan-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Get in touch, Contact form

Author Ho O

1.4k

Fork Fullscreen

<form action="https://fabform.io/f/xxxxx" method="post">
 
<section class="bg-gray-100">
    <div class="max-w-7xl mx-auto py-16 px-4 sm:px-6 lg:py-20 lg:px-8">
        <div class="max-w-2xl lg:max-w-4xl mx-auto text-center">
            <h2 class="text-3xl font-extrabold text-gray-900">Visit Our Location</h2>
            <p class="mt-4 text-lg text-gray-500">Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
        </div>
        <div class="mt-16 lg:mt-20">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
                <div class="rounded-lg overflow-hidden">
                    <iframe
                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d11672.945750644447!2d-122.42107853750231!3d37.7730507907087!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80858070cc2fbd55%3A0xa71491d736f62d5c!2sGolden%20Gate%20Bridge!5e0!3m2!1sen!2sus!4v1619524992238!5m2!1sen!2sus"
                        width="100%" height="480" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
                </div>
                <div>
                    <div class="max-w-full mx-auto rounded-lg overflow-hidden">
                        <div class="px-6 py-4">
                            <h3 class="text-lg font-medium text-gray-900">Our Address</h3>
                            <p class="mt-1 text-gray-600">123 Main St, San Francisco, CA 94105</p>
                        </div>
                        <div class="border-t border-gray-200 px-6 py-4">
                            <h3 class="text-lg font-medium text-gray-900">Hours</h3>
                            <p class="mt-1 text-gray-600">Monday - Friday: 9am - 5pm</p>
                            <p class="mt-1 text-gray-600">Saturday: 10am - 4pm</p>
                            <p class="mt-1 text-gray-600">Sunday: Closed</p>
                        </div>
                        <div class="border-t border-gray-200 px-6 py-4">
                            <h3 class="text-lg font-medium text-gray-900">Contact</h3>
                            <p class="mt-1 text-gray-600">Email: info@example.com</p>
                            <p class="mt-1 text-gray-600">Phone: +1 23494 34993</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

Related Examples

Why Everyone Around the World Loves Us
"Our platform is built to serve everyone, everywhere — with speed, security, and a human touch." "From cities to remote villages, our features connect the world through technology that truly cares." "Designed with the whole world in mind — fast, secure, and made for real people." "No matter who you are or where you're from, our tools are built to empower and inspire you." "We believe great technology should be accessible, safe, and helpful to all — and that's exactly what we offer."

Author:
Nicole Shalom

4 months ago

748
CONTACT US - GET IN TOUCH - PORTFOLIO
Responsive "Contact us" section, dark-mode-friendly contact area featuring stylish cards with icons displaying essential contact details.

Author:
ABDO-SY

7 months ago

1.2k
Contact us page template
full page fancy contact us page

Author:
Lukas Müller

2 years ago

16.8k
Responsive Contact Information and Inquiry Form Component
This component is a fully responsive and reusable section designed for websites that need to display contact information alongside a user inquiry form. It is built with Tailwind CSS for easy customization and integration into any projec

Author:
Vikas Kushwah

6 months ago

814
Contact me form

Author:
Arya

2 years ago

11.8k
Glassmorphism form

Author:
Geoffrey Callaghan

1 year ago

6.3k
Call Display UI built with Tailwind CSS
Here's a Call Display UI built with Tailwind CSS that mimics an incoming/ongoing call screen with a modern design:

Author:
irahoza daniel

4 months ago

269
contact form
contact form

Author:
Geoffrey Callaghan

1 year ago

6.3k
Contact Us / Enquiry-form Responsive

Author:
KULDEEP

3 months ago

784
Feedback + Contact Us form

Author:
Rajesh kulkarni

2 years ago

12.3k
tailwind contact form template
tailwind contact form template

Author:
Ti To

1 year ago

5.2k
Contact us form with map
Contact us form with map

Author:
Chithira Kumar M

1 year ago

11.8k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components