Random Image Generator
A random image generator creates placeholder images using Lorem Picsum (picsum.photos), a free service providing random high-quality photos from Unsplash. Access via simple URLs like picsum.photos/800/600 for random images, or picsum.photos/id/237/800/600 for specific consistent images. Supports grayscale (?grayscale) and blur (?blur=1-10) parameters. Perfect for mockups, prototypes, and testing image layouts. Common sizes: Instagram (1080×1080), Facebook (1200×630), HD (1920×1080). Images are CDN-cached and free to use under Unsplash License.
Generate random placeholder images for mockups, prototypes, and design projects. Powered by Lorem Picsum with custom dimensions, grayscale, blur effects, and common presets (Instagram, Facebook, Twitter, HD). Perfect for wireframes and testing layouts.
Image Settings
Preview
Dimensions: 800 × 600 pixels
Image ID: 801
URL: https://picsum.photos/id/801/800/600
How to Use
In HTML:
<img src="https://picsum.photos/800/600" alt="Placeholder" />Specific Image (repeatable):
<img src="https://picsum.photos/id/801/800/600" alt="Placeholder" />With Effects:
<!-- Grayscale -->
<img src="https://picsum.photos/800/600?grayscale" alt="Placeholder" />
<!-- Blur -->
<img src="https://picsum.photos/800/600?blur=2" alt="Placeholder" />About Lorem Picsum:
This tool uses Lorem Picsum , a free service providing beautiful placeholder images from Unsplash. Perfect for wireframes, mockups, and prototypes.
Use Cases:
- Prototyping and wireframing websites or apps
- Creating design mockups without stock photos
- Testing responsive image layouts
- Placeholder content for client presentations
How to Use
- 1
Set image dimensions
Enter custom width and height in pixels, or select from common presets like Instagram (1080×1080), Facebook (1200×630), or HD (1920×1080)
- 2
Configure effects (optional)
Choose blur level (0-5) and toggle grayscale on/off to customize the image appearance
- 3
Generate random image
Click "New Random Image" to generate a new random photo from Lorem Picsum
- 4
Copy URL or download
Click "Copy URL" to get the image URL for use in HTML/CSS, or "Download" to save the image file
- 5
Use in your project
Paste the URL into your HTML img tag or CSS background-image property for instant placeholder images
Frequently Asked Questions
- What is Lorem Picsum and how does it work?
- Lorem Picsum (picsum.photos) is a free placeholder image service that provides random high-quality photos from Unsplash. It works by serving images via simple URLs like picsum.photos/800/600, which returns a random 800×600px image. Add /id/NUMBER to get a specific image that stays consistent (e.g., picsum.photos/id/237/800/600). The service supports grayscale (?grayscale) and blur (?blur=1 to 10) parameters. Images are cached on a CDN for fast delivery worldwide. Unlike static placeholders, Lorem Picsum provides realistic photos perfect for testing image layouts, prototypes, and mockups.
- How do I use random images in my HTML or React project?
- In HTML: <img src="https://picsum.photos/800/600" alt="Random placeholder">. For a specific image that doesn't change: <img src="https://picsum.photos/id/237/800/600" alt="Specific image">. In React: <img src={`https://picsum.photos/${width}/${height}`} alt="Random" />. For grayscale: <img src="https://picsum.photos/800/600?grayscale" alt="Grayscale">. With blur: <img src="https://picsum.photos/800/600?blur=2" alt="Blurred">. Each page reload fetches a new random image unless you use /id/NUMBER. For production, replace with real images or use services like Unsplash API, Cloudinary, or Imgix.
- What are the best random image sizes for different use cases?
- For social media: Instagram (1080×1080), Facebook post (1200×630), Twitter card (1200×675), YouTube thumbnail (1280×720). For web design: hero image (1920×1080), card thumbnail (400×300), profile avatar (200×200), blog post featured image (1200×630). For mobile mockups: iPhone (375×667), iPad (768×1024). For desktop: full HD (1920×1080), 4K (3840×2160). For prototypes, use slightly smaller sizes (800×600, 500×500) to speed up loading. Lorem Picsum supports any dimension up to 5000×5000px, but keep images under 2MB for practical use.
- Can I use Lorem Picsum images in commercial projects?
- Lorem Picsum images come from Unsplash, which offers free-to-use photos under the Unsplash License. You can use them in commercial and non-commercial projects without attribution (though attribution is appreciated). However, you cannot sell the photos as-is or use them to create a competing image service. For production websites, it is recommended to replace placeholders with your own images or properly licensed stock photos. Lorem Picsum is best for development, prototypes, and mockups — not final production unless you verify each image's specific license on Unsplash.
- How do I get the same random image on every page load?
- Use the /id/NUMBER format: https://picsum.photos/id/237/800/600. The number can be any integer (Lorem Picsum has 1000+ images). This ensures the same image loads every time. To generate a consistent random ID in JavaScript: const randomId = Math.floor(Math.random() * 1000); const imageUrl = `https://picsum.photos/id/${randomId}/800/600`;. Store the ID in state or localStorage to maintain consistency across page reloads. Without /id/, every request returns a different random image from Picsum's library.
- What are the grayscale and blur parameters for Lorem Picsum?
- Add ?grayscale to convert images to black and white: picsum.photos/800/600?grayscale. For blur, use ?blur=LEVEL where LEVEL is 1-10: picsum.photos/800/600?blur=3. Combine parameters with &: picsum.photos/800/600?grayscale&blur=2 (grayscale with slight blur). Higher blur values create stronger effects: blur=1 is subtle, blur=5 is medium, blur=10 is very blurred. Use grayscale for minimalist designs or to reduce visual noise. Use blur for background images or to simulate loading states. These effects are rendered server-side, so the image downloads already processed.
- What are the best alternatives to Lorem Picsum for placeholder images?
- Alternatives: Unsplash Source (source.unsplash.com) provides random Unsplash photos with category filters (e.g., source.unsplash.com/800x600/?nature). Placehold.co (placehold.co/800x600) generates simple colored placeholders with custom text. Placeholder.com (via.placeholder.com/800x600) creates basic gray placeholders. Pravatar.cc provides avatar placeholders. For custom placeholders, use placeholder image generators that let you control colors, text, and format (PNG/SVG). For production, use real images from stock sites (Pexels, Pixabay, Unsplash) or your own photography.
- How do I download Lorem Picsum images for offline use?
- Right-click the image in your browser and select "Save Image As" to download it locally. Or programmatically: fetch("https://picsum.photos/800/600").then(res => res.blob()).then(blob => { const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = "image.jpg"; a.click(); }); For bulk downloads, write a script to fetch multiple IDs: for(let i = 1; i <= 50; i++) { fetch(`https://picsum.photos/id/${i}/800/600`); }. Remember: Lorem Picsum images are for prototyping — replace with licensed or original images before production deployment.