YouTube End Screen Simulator

Design your end screen layout. Test it before uploading. Export it for After Effects.

100% Free · No Sign-Up
Templates Skip the guesswork — start with studio-grade Youtube end screen templates Browse Collection

Drop your video here

MP4 or WebM · Short videos work best (5–10s)

Canvas Settings

Updates automatically when media is loaded.

Layout Status
Layout Valid
Add Elements
Element List
Quick Templates
1 Vid, 1 Sub
2 Videos
1 Vid, 1 Play
Standard Balance
1 Play, 1 Sub
1 Vid, 1 Play, 1 Sub
End Screen Mode
Enable End Screen
End Screen Duration
Duration (from end) 5.0s

YouTube allows end screens during the last 5–20 seconds. Elements appear only during this window when a video is loaded.

Shortcuts
Play / Pause Space
Delete Element Del
Deselect Esc
Device Preview
Overlays
YouTube Safe Zone
Grid Lines
Snapping
Snap to Grid
Export Layout
Layout Preview
{
  "canvas": { "width": 1920, "height": 1080 },
  "elements": []
}

Thunder Studio

Import this JSON directly into After Effects. Auto-generates shape layers from your layout.

Get Extension

End Screen Templates

Unlock professional After Effects kits designed specifically for this simulator.

Explore Templates
Timeline 0:00 / 0:00
End Screen
Why Creators Use This

Stop Guessing. Start Designing.

YouTube gives you zero tools to preview your end screen before publishing. This simulator lets you design, test, and perfect your layout — so you never wonder "will this look right?" again.

Preview Before Upload

Test how your end screen elements look over your actual video footage. Catch overlap issues and bad positioning before your audience does.

Create End Screen Templates

Build reusable layouts once and export them as JSON files. Load the same layout into After Effects for every video — consistent branding, zero effort.

Mobile-Safe Layouts

Toggle the mobile crop preview to see how your end screen looks on phones. YouTube crops 16:9 videos on mobile — make sure your elements stay visible.

After Effects Integration

Design Here, Build in After Effects

Export your layout as JSON, then use Thunder Studio to instantly generate shape layers in After Effects — pixel-perfect positioning, zero manual alignment.

The extension reads your layout data and creates color-coded placeholder shapes at the exact positions. Select multiple layouts and batch-build compositions in one click.

1 Design your layout in this simulator
2 Export JSON — one click, done
3 Open After Effects → Thunder Studio
4 Import → Shape layers auto-generated at exact positions
Get Thunder Studio — Free
Example Layout JSON
{
  "version": "1.0",
  "tool": "Thunder Motion End Screen Simulator",
  "canvas": {
    "width": 1920,
    "height": 1080
  },
  "safeZone": {
    "left": 96,
    "top": 54,
    "right": 1824,
    "bottom": 918
  },
  "elements": [
    {
      "type": "video",
      "name": "Video #1",
      "x": 40,
      "y": 140,
      "width": 615,
      "height": 345
    },
    {
      "type": "subscribe",
      "name": "Subscribe #2",
      "x": 1586,
      "y": 140,
      "width": 294,
      "height": 294
    }
  ]
}
Action completed