Back to Dictionary
Waiting & Loading
●○○Ready to Use
Content Placeholder
Static, non-animated geometric shapes representing where text or images will render. Simpler than a skeleton screen, often used on lower-end devices or ultra-fast loads.
Live Demo
Image Placeholder
What It Is
Static, non-animated geometric shapes representing where text or images will render. Simpler than a skeleton screen, often used on lower-end devices or ultra-fast loads.
✓When to Use
- When fetch time is extremely fast but layout shift must be avoided
✕When NOT to Use
- Long loaders > 1s (prefer animated skeletons)
Configuration Tips
- 01Match the exact height and width of the final rendered content
You've Seen It In
News sitesWikipedia mobile
Prompt Templates
Copy and paste these prompts into your AI coding assistant.
Create static gray box placeholders for a list.
Code Example (Tailwind CSS)
export function ContentPlaceholderDemo() {}