Sample Images & Photography
Property-themed sample images from Unsplash for use in components, templates, and mockups. All images are optimized with query parameters for best performance. Click "Copy URL" to get the exact link for your component.
Property & Landscape
High-quality cottage, house, and nature imagery perfect for property listings and hero sections.
Forest Cottage
photo-1504280390367-361c6d9f38f4
Mountain House
photo-1504674900247-0877df9cc836
Country Manor
photo-1522202176988-66273c2fd55f
Cozy Cabin
photo-1482192505345-5655af888cc4
Modern Villa
photo-1544025162-d76694265947
Garden Retreat
photo-1506905925346-21bda4d32df4
Lakeside Home
photo-1510798831971-661eb04b3739
Forest View
photo-1510312305653-8ed496efae75
Autumn Cottage
photo-1470252649378-9c29740c9fa8
Nature & Lifestyle
Natural scenery and lifestyle photography for hero sections, banners, and atmospheric imagery.
Summer Getaway
photo-1542314831-068cd1dbfeeb
Forest Trail
photo-1448375240586-882707db888b
How to Use Sample Images
All Unsplash image URLs include optimization parameters for best performance:
URL Parameters Explained
| Parameter | Value | Purpose |
|---|---|---|
ixlib=rb-4.0.3 |
Imgix library version | Ensures consistent image processing |
auto=format |
Automatic format selection | Serves WebP to modern browsers, JPEG to older ones |
fit=crop |
Crop mode | Crops image to exact dimensions without distortion |
w=600 |
Width in pixels | Downloads 600px width (size is adjusted per use case) |
q=80 |
Quality 0-100 | 80% quality balances file size and visual quality |
In Card Components (Property Listings)
<img
src="https://images.unsplash.com/photo-1504280390367-361c6d9f38f4?ixlib=rb-4.0.3&auto=format&fit=crop&w=600&q=80"
alt="Mountain Cottage">
In Hero Sections (Full Width)
<img
src="https://images.unsplash.com/photo-1510798831971-661eb04b3739?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80"
alt="Hero background">
Responsive Image Technique
<picture> <source media="(max-width: 640px)"
srcset="https://images.unsplash.com/...?w=640&q=80"> <source
media="(max-width: 1024px)"
srcset="https://images.unsplash.com/...?w=1024&q=80"> <img
src="https://images.unsplash.com/...?w=1920&q=80"
alt="Description"> </picture>
Best Practices
✅ DO:
- Use optimized URLs with proper query parameters
- Always include descriptive alt text for accessibility
- Use crop mode (fit=crop) to maintain aspect ratios
- Adjust width parameter based on container size (w=300 for thumbnails, w=600 for cards, w=1920 for hero)
- Use q=80 for balanced quality/file size (use q=90+ for hero images only)
- Test images in both light and dark theme contexts
❌ DON'T:
- Use placeholder images in production code
- Link directly to unoptimized original Unsplash URLs
- Use very low quality settings (q < 70) for property photos
- Forget alt text for SEO and accessibility
- Hardcode fixed pixel dimensions instead of using responsive sizing
- Load full-resolution images for thumbnail/card displays