Preview approximate TikTok, Reels or Shorts overlays on a portrait image.
Design* āļāļĢāļīāđāļ§āļāļŠāļĩāđāļāļāļāļ·āļāļāļļāļāļāļĩāđāļāļēāļāļāļđāļāļāļąāļāļāđāļ§āļĒāļāļļāđāļĄāļāļ, āļāļģāļāļĢāļĢāļĒāļēāļĒ, āļŦāļĢāļ·āļāđāļāļāļāļāļāļāļāđāļāļĨāļāļāļāļĢāđāļĄ
āļāļąāļāđāļŦāļĨāļāļĢāļđāļāļ āļēāļāļāļāļēāļ 1080x1920 āđāļāļ·āđāļāđāļĢāļīāđāļĄāļāļāļŠāļāļ
āļāļēāļĢāļ§āļēāļāļāđāļāļāļ§āļēāļĄāļŠāļģāļāļąāļ (Call to Action) āļŦāļĢāļ·āļāđāļāļŦāļāđāļēāļāļāđāļ§āđāļāļīāļāļāļļāļāđāļāļ§āļīāļāļĩāđāļāđāļāļ§āļāļąāđāļ (9:16) āļāļēāļāļāļģāđāļŦāđāđāļāļ·āđāļāļŦāļēāļāļđāļāļāļąāļāđāļāļĒāļāļļāđāļĄ Like, Share, āļŦāļĢāļ·āļāļāļ·āđāļāļāļąāļāļāļĩāļāļđāđāđāļāđ āļāļķāđāļāļāļ°āļāđāļ§āļĒāļĨāļāļāļĢāļ°āļŠāļīāļāļāļīāļ āļēāļāļāļāļāļāļāļāđāļāļāļāđāļāļļāļ āđāļāļĢāļ·āđāļāļāļĄāļ·āļāļāļĩāđāļāļģāļĨāļāļāļāļģāđāļŦāļāđāļ UI āļāļĢāļīāļāđāļāļ·āđāļāđāļŦāđāļāļļāļāļĄāļąāđāļāđāļāļ§āđāļēāļāļļāļāļŠāļģāļāļąāļāļāļāļāļ āļēāļāļāļ°āđāļāđāļāļāļąāļāđāļŠāļĄāļ
**Safe Zone** āļāļ·āļāļāļ·āđāļāļāļĩāđāļāļĨāļāļāļ āļąāļĒāļāļāļ āļēāļāļŦāļĢāļ·āļāļ§āļīāļāļĩāđāļāļāļĩāđāđāļāļ·āđāļāļŦāļēāļŠāļģāļāļąāļāļāļāļāļāļļāļāļāļ°āđāļĄāđāļāļđāļāļĢāļāļāļ§āļāļŦāļĢāļ·āļāļāļđāļāļāļąāļāđāļāļĒāļāļāļāđāļāļĢāļ°āļāļāļ UI āļāļāļāđāļāļāļāļĨāļīāđāļāļāļąāļāļāļąāđāļāđ āđāļāđāļ āļāļļāđāļĄ Like, āļāļļāđāļĄ Share, āļāļ·āđāļāđāļāļĢāđāļāļĨāđ āļŦāļĢāļ·āļāļāļģāļāļĢāļĢāļĒāļēāļĒāđāļāđāļ āļēāļ (Caption)
āđāļāļĒāđāļāļāļēāļ°āđāļāļ§āļīāļāļĩāđāļāđāļāļ§āļāļąāđāļ (Vertical Video 9:16) āļāļĒāđāļēāļ **TikTok, Reels āđāļĨāļ° YouTube Shorts** āļāļĩāđāļĄāļĩāļāļāļāđāļāļĢāļ°āļāļāļāļāļāļŦāļāđāļēāļāļāđāļĒāļāļ°āļĄāļēāļ āļāļēāļĢāļĢāļđāđāļ§āđāļē "āļāļ·āđāļāļāļĩāđāđāļŦāļāļŦāđāļēāļĄāļ§āļēāļāļāđāļāļāļ§āļēāļĄ" āļāļ°āļāđāļ§āļĒāđāļŦāđāļāļđāđāļāļĄāļāļāļāļāļļāļāđāļāđāļĢāļąāļāļŠāļēāļĢāļāļĒāđāļēāļāļāļĢāļāļāđāļ§āļ
āļ§āļēāļāļāļāļāđāļāļĢāļ°āļāļāļāļŠāļģāļāļąāļāļāļāļāļāļļāļāđāļ§āđāđāļāļāļļāļāļāļĩāđāļĄāļāļāđāļŦāđāļāļāļąāļāđāļāļāļāļĩāđāļŠāļļāļ āđāļāļ·āđāļāđāļāļīāđāļĄ Engagement āđāļŦāđāļāļąāļāļāļāļāđāļāļāļāđ
āđāļāļĒāļāļāļāļīāđāļĨāđāļ§ āļāļ·āđāļāļāļĩāđāļāļķāđāļāļāļĨāļēāļāļāļāļāļŦāļāđāļēāļāļāļāđāļāļāđāļāļāļēāļāļāļāđāļĨāđāļāļāđāļāļĒ āļāļ·āļāļāļļāļāļāļĩāđāļāļĨāļāļāļ āļąāļĒāļāļĩāđāļŠāļļāļ āđāļĨāļ°āļāļ§āļĢāđāļĨāļĩāđāļĒāļāļāļ·āđāļāļāļĩāđāļāđāļēāļāļĨāđāļēāļāđāļĨāļ°āļāđāļēāļāļāļ§āļēāļāļĒāđāļēāļāļāđāļāļĒ 15-20%
āļāļąāļāļāļļāļāļąāļāđāļāļĢāļ·āđāļāļāļĄāļ·āļāļāļĩāđāļĢāļāļāļĢāļąāļāļāļēāļĢāļāļąāļāđāļŦāļĨāļāđāļāļĨāđāļ āļēāļ (Screenshot) āđāļāļ·āđāļāļāļāļŠāļāļāļāļąāļāļ§āļēāļāļāļāļāđāļāļĢāļ°āļāļāļ āļŦāļēāļāļāļļāļāļāļģāļ§āļīāļāļĩāđāļ āļŠāļēāļĄāļēāļĢāļāđāļāđāļ āļēāļāļāļīāđāļāļĄāļēāļĨāļāļāļ§āļēāļāđāļāđāļāļāļđāļāđāļāļāļāļąāļāļāđāļāļāļĢāļīāļāđāļāđāļāļĢāļąāļ
Choose TikTok, Instagram Reels or YouTube Shorts.
Select a portrait image.
Toggle the overlay and inspect where important content might be covered.
Found incorrect guidance or a result? Send the team steps and a non-sensitive example.
Select a color and copy HEX, RGB, HSL and other displayed color values.
Adjust linear or radial gradient stops and copy the generated CSS.
Build layered CSS box shadows with offsets, blur, spread, color and inset options.
Adjust individual corner radii in pixels or percentages and copy the CSS.
Generate color harmonies from a base color and copy palette values.
Browse the built-in Tailwind color table and copy a color or utility value.