Home
AKASH GANDHAR
Contact Us

Contact Us

Fully Responsive Contact Us page with google maps embeded

This tailwind example is contributed by AKASH GANDHAR, on 06-Jul-2024. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Get in touch, Contact form

Author AKASH GANDHAR

2.1k

Fork Fullscreen

<div class="flex flex-wrap justify-center items-center h-auto p-5 pl-[6%] pt-[9%]">
        <div class="w-full md:w-2/5 p-4">
          <h2 class="text-xl md:text-7xl font-semibold mb-5">GET IN TOUCH!</h2>
          <form class="space-y-4">
            <div>
              <input type="text" id="fullName" name="fullName" placeholder='Full Name' class="mt-1 p-4 w-full border rounded-md" />
            </div>
            <div>
              <input type="email" id="email" name="email" placeholder='Email' class="mt-1 p-4 w-full border rounded-md" />
            </div>
            <div>
              <textarea id="message" name="message" placeholder='Message' class="mt-1 p-4 w-full border rounded-md" rows="4"></textarea>
            </div>
            <button type="submit" class="px-8 py-4 bg-black text-white hover:bg-blue-700">Submit</button>
          </form>
        </div>
        <div class="w-full md:w-1/2 p-4 flex justify-center">
          <div class="rounded-full overflow-hidden w-[35rem] h-[35rem]">
            <iframe
              class="w-[35rem] h-[35rem]"
              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d243647.3160407063!2d-74.25986568785095!3d40.697670063849574!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zNDDCsDQxJzUxLjYiTiA3NMKwMTUnMzUuNyJX!5e0!3m2!1sen!2sus!4v1652901957916"
              allowFullScreen=""
              loading="lazy"
              referrerPolicy="no-referrer-when-downgrade"
            ></iframe>
          </div>
        </div>
      </div>

Related Examples

Contact Us / Enquiry-form Responsive

Author:
KULDEEP

4 months ago

998
Contact section - Htmlwind
Simple grid contact section

Author:
Htmlwind

5 months ago

575
Contact page

Author:
Mahir

2 years ago

17.5k
home
html , css

Author:
Hacker Development

5 months ago

1.5k
Contact us page

Author:
Freja Jensen

2 years ago

11.8k
Contact us section
Minimal contact us form

Author:
Geoffrey Callaghan

2 years ago

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

Author:
Geoffrey Callaghan

1 year ago

6.3k
Simple contact us form

Author:
Lukas Müller

2 years ago

11.7k
Contact us page

Author:
Geoffrey Callaghan

2 years ago

5.8k
Contact us Form with Responsive

Author:
KULDEEP

3 months ago

355
Contact Us Form
CTAs help convert visitors into action-takers (customers, subscribers, etc.), while Contact Us forms enable easy communication, building trust and support. Both are vital for engaging visitors and achieving your website’s objectives.

Author:
KULDEEP

4 months ago

474
popup modal contact form
Working modal popup contact form in tailwind CSS Simple snippet for creating a popup contact form with tailwind and javascript uses fabform.io

Author:
Ti To

1 year ago

6.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components