Elegant Split-Layout Contact Form (Navy Blue Edition)
Overview: A premium contact section styled in Navy Blue (bg-blue-900) to match the Service Carousel.
Key Changes:
Palette: Swapped all Teal references for Deep Blue (bg-blue-900 panel, text-blue-700 accents).
Interactivity: Focus rings on inputs now glow with a soft blue (focus:ring-blue-600/10).
Consistency: Maintains the "DM Serif Display" typography and "blob" background effects (now in blue/indigo) for a cohesive high-end look.
This tailwind example is contributed by Juan D. Cortorreal, on 23-Nov-2025. Component is made with Tailwind v3.4. It is responsive.
Related Examples
-
-
Login FormAdmin Login Form
2.5k -
Responsive Contact Section Using Tailwind CSSThis HTML and Tailwind CSS snippet creates a visually appealing and responsive contact section. Designed to adapt seamlessly across different screen sizes, this component features two main areas: the contact information block and a contact form. The contact block displays essential details like phone, email, and address, alongside social media links, all encapsulated within a cyan-themed card with rounded corners and shadow effects for depth. The form area, highlighted with a contrasting white background, ensures a user-friendly interface for submitting contact details. This code snippet is perfect for integration into any modern web application requiring a responsive and stylish contact section.
3.7k -
-
update userit is the layout for creating an event
2.4k -
-
-
LOGIN TEMPLATEit is a login template
-
2.1k -
Checkout formA versatile checkout form component for users to provide shipping and payment information. It has fields for first name, last name, address, city, state, ZIP code, card number, expiration date, and CVV.
13.5k -
4.7k -
1.1k
Browse by topic
Explore components by Tags
Jump straight to the UI pattern you need.
Can't find it?
Didn't find the component you were looking for?
Search across 3,000+ community-built components and grab the code in seconds.