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.7k

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

Contact Information section with form
A section that displays ways to connect, featuring icons for social media and clickable email addresses.

Author:
Geoffrey Callaghan

1 year ago

5.4k
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

5 months ago

847
contact us form
contact us form that uses the Free VeilMail EmailProtection Service too!

Author:
Geoffrey Callaghan

1 year ago

6.3k
Responsive contact us section
responsive contact section

Author:
Geoffrey Callaghan

1 year ago

6.9k
damatebis forma

Author:
Tamaz gogitidze

1 year ago

1.8k
Contact us form with map
Contact us form with map

Author:
Chithira Kumar M

1 year ago

11.8k
contact form
contact form

Author:
Geoffrey Callaghan

1 year ago

6.5k
Contact Form for fabform.io
Contact form that uses fabform.io

Author:
Ho O

9 months ago

532
Basic contact us section with google map

Author:
Anonymous

2 years ago

12.3k
Contact us section
Minimal contact us form

Author:
Geoffrey Callaghan

1 year ago

5.5k
Contact Us

Author:
ariaw

1 week ago

31
tailwind contact form
Nice looking tailwind contact form

Author:
Geoffrey Callaghan

1 year ago

2.4k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components