YouTube thumbnail design with specific dimensions, contrast rules, and mobile preview optimization. Covers safe zones, text placement, face expression psychology, and A/B testing. Use for: YouTube thumbnails, video cover images, click-through optimization. Triggers: youtube thumbnail, thumbnail desi

Install the belt CLI skill: npx skills add belt sh/cli YouTube Thumbnail Design Create high CTR YouTube thumbnails with AI image generation via [inference.sh](https://inference.sh) CLI. Quick Start Requires inference.sh CLI ( belt ). [Install instructions](https://raw.githubusercontent.com/inference sh/skills/refs/heads/main/cli install.md) Specifications Spec Value Dimensions 1280 x 720 px (minimum) Recommended 1920 x 1080 px Aspect ratio 16:9 Max file size 2 MB Formats JPG, GIF, PNG The 120px Test Your thumbnail appears at roughly 120px wide on mobile — that's how most viewers first see it. At 120px, viewers must be able to identify: 1. The mood/emotion (from colors and expression) 2. The general subject (from composition) 3. The text (if any — only if large enough) Test: view your thumbnail at 120px width. If it's a muddy blur, redesign. Safe Zones Avoid placing critical elements in: Bottom right corner (video duration timestamp) Bottom left corner (chapter markers, progress bar) Extreme edges (cropping varies by device) Color Strategy High Contrast Pairs That Work Combination Mood Best For Yellow + Black Urgency, attention Tech, business, lists Red + White Energy, excitement Entertainment, reactions Blue + Orange Professional contrast Education, tutorials Green + White Growth, money Finance, success stories Purple + Yellow Premium, creative Design, art, creativity White + Dark Clean, minimal Luxury, minimalist channels Color Rules Background and text/subject should be complementary or high contrast Avoid same temperature colors touching (red on orange = mud) Use 3 colors maximum per thumbnail Saturate more than real life — thumbnails compete with bright UI Text on Thumbnails When to Use Text Lists/numbers: "7 Tips", "Top 10" Strong opinions: "STOP Doing This" Results: "$10K in 30 Days" Comparisons: "vs" between two things When NOT to Use Text The video title already says it (redundant) The emotion/visual tells the story You can't make it large enough to read at 120px Text Rules Rule Reason Max 6 words Readability at thumbnail size Min 60pt equivalent Must be legible at 120px width Bold sans serif font Thin fonts disappear at small sizes Contrast stroke/shadow Ensures readability on any background No small text If it's not readable small, cut it Face Expression Psychology Thumbnails with faces get higher CTR than faceless thumbnails. Expression matters: Expression CTR Impact Best For Surprise/shock Highest Reaction, reveal, discovery content Curiosity High Tutorial, how to, tips Excitement High Unboxing, reviews, announcements Concern/worry Medium high Warning, mistake, problem content Confidence Medium Expert advice, authority content Neutral Lowest Avoid unless your brand is minimalist Face Composition Rules Face should fill 30 50% of the thumbnail Eyes looking toward the text or subject (directs viewer attention) Eyes looking at camera = connection. Eyes looking at object = curiosity. Place face on one side (usually left), text or subject on the other Thumbnail Patterns by Content Type Tutorial / How To Before/After Product Review / Comparison Listicle / Number A/B Testing Test one variable at a time: Variable Test A vs B Face vs No face Same composition, with/without person Expression Surprise vs curiosity Color scheme Warm vs cool palette Text vs No text With/without text overlay Background Bright vs dark Composition Left facing vs right facing subject Thumbnail Checklist [ ] 1280x720 minimum (1920x1080 preferred) [ ] Under 2MB file size [ ] Passes the 120px squint test [ ] No critical elements in bottom right (timestamp) or bottom left (chapter) [ ] Max 3 colors, high contrast [ ] Text (if any) is max 6 words, bold, with contrast stroke [ ] Face expression matches content energy (if applicable) [ ] Doesn't duplicate the video title [ ] Stands out from surrounding thumbnails (check your niche) [ ] Works on both light and dark YouTube backgrounds Common Mistakes Mistake Problem Fix Too much text Unreadable at thumbnail size Max 6 words or no text Low contrast Disappears in the feed Use complementary colors Cluttered composition Eye doesn't know where to look One focal point Generic stock photo feel No personality, gets skipped Authentic expressions, unique angles Tiny details Lost at 120px Bold, simple shapes Same style every video Viewer fatigue Vary within brand guidelines Misleading thumbnail Kills trust, hurts retention Match the actual content Related Skills Browse all apps: belt app list

youtube-thumbnail-design