SHADERERA®Video made in code · v0.1.2PluginsAgentsGitHub ↗
← PluginsLayout & Formatscomponent · v0.1.0 · MIT
format-safe-areasOfficial · by Shaderera

Safe areas and the tall-frame lens

Where text may go in 16:9, 1:1 and 9:16, clear of YouTube Shorts, Reels and TikTok UI; and the lens rule that keeps a 16:9 shot reading in a vertical variant.

Add it to a filmOr ask your agent
“Use the shaderera-plugins skill to add format-safe-areas to this film and wire it in, then run check and show me a still.”
Type
component · Layout & Formats
Version
0.1.0 · published
Licence
MIT
Built on
No other plugins
npm
No packages
Tags
safe area, vertical, 9:16, shorts, reels, tiktok, variants, fov, lens
Source on GitHub ↗
READMEformat-safe-areas

How to
use it.

Safe areas for text per format and platform, and the lens rule that keeps a 16:9 shot reading in 9:16.

README.mdexample
import { safeArea, widenFov } from './layout/frame.ts'const a = safeArea(W, H, 'reels')          // { x, y, width, height, left, right, top, bottom } in pxctx.fillText(title, a.x, a.y + a.height)   // never under the platform's buttons or caption lineconst fov = widenFov(Math.PI / 4, W / H)   // the lens for this frame: 16:9 keeps it, 9:16 opens half way

With no platform, generic title-safe margins; Shaderera itself assumes none (decision 0011). 'reels' is Meta's Reels ads safe zone (14 % top, 35 % bottom, 6 % sides, read 2026-10-12). 'shorts' and 'tiktok' estimate the right-hand button rail and the bottom caption line; check the platform's current safe-zone files before a delivery. To have review check text against one, put it in requirements.json safeArea as fractions. Relay each format; never crop one from another.

More in Layout & Formats02 plugins

More in Layout & Formats