AL
an le

House Product Card - Copy this Html, Bootstrap Component to your project

Design a vertical product card for a real estate investment website. The card should have a clean, modern aesthetic and be organized in a visually appealing layout. It includes the following elements: Top Section: Display a large, high-resolution image of the house or property, taking up about 60% of the card space. Details Box: Directly below the image, there should be a centered box containing the following: House Name: The name of the property in a bold, legible font. Price: Clearly display the price in a slightly larger font size. Address: The property’s address in a smaller, lighter font underneath the price. Features Section: Beneath the details box, include icons to represent the key features: Bedroom Icon: Show an icon of a bed with the number of bedrooms next to it. Bathroom Icon: Display an icon of a showerhead with the number of bathrooms next to it. Agent Details: At the bottom of the card, include the agent's information in a clearly defined section: Agent Image: A small, circular image of the agent on the left side. Agent Name: The name of the agent in bold next to the image. Contact Information: The agent's phone number below their name in a smaller font. The design should maintain a balance between clarity, elegance, and professionalism, ensuring easy readability on mobile devices.

Prompt
Component Preview

About

House Product Card - Showcase house images, names, prices, and addresses with icons for bedrooms and bathrooms. Built with HTML and Boo. Copy template now!

Share

Last updated 1 month ago