Skip to content

Guide · Agent skill

How to use the Light-Leak Cinematic Frame agent skill

Updated · written with AI from the project's own documentation and checked against our catalogue data

The Light-Leak Cinematic Frame skill is a style guide for an AI agent. Once installed, the agent can take your title or content and produce a single HTML page styled as a cinematic opening or chapter card, with warm film light leaks, grain, black letterbox bars and large serif type. This guide explains what the skill does, how to install it, how to ask for it, and what to check before you use the output.

Light-Leak Cinematic Framenexu-io/open-design · Apache-2.0

Quick start

  1. 1Download the ZIP. Get the skill ZIP from this page and unzip it. Confirm the folder contains SKILL.md.
  2. 2Place the folder. Move the unzipped folder into ~/.claude/skills/ for all projects, or into .claude/skills/ inside one project.
  3. 3Or upload in the Claude apps. In the Claude apps, go to Settings → Capabilities → Skills and upload the skill.
  4. 4Describe your frame. Ask the agent for a cinematic opening or chapter card and include your title, subtitle and any chapter or place details.
  5. 5Choose the canvas. Pick 2.39:1 letterbox at 1920×800 for a film look, or 16:9 at 1920×1080 for a standard frame.
  6. 6Open and check the HTML. Open the generated HTML file in a browser, check the text and colours, and take a screenshot if you need an image.

What an agent skill is and what this one does

An agent skill is a folder of instructions that an AI agent reads when it is relevant to a task. The skill's main file is SKILL.md, which describes the visual rules the agent should follow.

This skill, named frame-light-leak-cinema, follows a fixed visual recipe: warm orange light leaks, a 35mm-style film-grain texture, a 2.39:1 letterbox (or 16:9) canvas, and large serif type with small monospace captions. The output is one HTML frame. It is not a video editor and does not render video or animation.

  • Canvas: 2.39:1 letterbox at 1920×800 with black bars, or 16:9 at 1920×1080 with no letterbox
  • Background: dark warm base with radial and linear warm light leaks; cool blue and neon colours are avoided
  • Type: large serif headline in warm cream, a one-line subtitle, and uppercase mono captions
  • Optional extras: film scratches, sprocket holes, and a short underexposed fade-in

Install the skill from the ZIP

Download the ZIP of the skill from this page and unzip it. The skill folder contains example.html, open-design.json and SKILL.md.

To use it across your projects, place the unzipped folder in ~/.claude/skills/. To use it for one project only, place it in that project's .claude/skills/ folder.

If you use the Claude apps, you can instead upload the skill under Settings → Capabilities → Skills.

  • Personal install: ~/.claude/skills/
  • Project install: .claude/skills/ inside your project
  • Claude apps: Settings → Capabilities → Skills

Trigger the skill with a natural request

You do not need a special command. Describe the frame you want and mention the content. The agent reads the skill when the request matches its purpose: a cinematic opening, a chapter card, or a title screen with a vintage film look.

The example prompt below is taken from the skill's own metadata. Replace the placeholder wording with your real content. Adding details such as a chapter number, year or location is useful, because the skill notes that the agent can estimate reasonable metadata, though it should use the content you provide.

Use the Light-Leak Cinematic Frame template to turn my content into a cinematic opening or chapter card with film light leaks, grain, letterbox framing, and large serif type. Preserve the template's visual signature, use real content and data, and avoid lorem ipsum or placeholder images.

Examples of requests and what you get

For a documentary, ask for an opening card with your film title and a subtitle. The agent should set the title in large serif type over a warm light-leak background, with a monospace caption such as a reel or chapter label in the corner.

For a chapter card, give the chapter number and name. The skill suggests small captions like "REEL 03 · CH I" and a bottom line for timecode, place and date, so you can supply those values or ask the agent to estimate them.

  • "Make a 2.39:1 opening card for my short film called [title], with warm light leaks and grain."
  • "Create a chapter card for Chapter II of my documentary, with a serif headline and a mono caption in the corner."
  • "Make a 16:9 title frame for our product launch video in the same cinematic style."

What the skill needs and how to view the output

The skill requires a SKILL.md-compatible agent environment. You need a web browser to open the resulting HTML file. The skill's metadata states that it does not run scripts and does not use the network.

Open the HTML file in your browser to preview it. You can take a screenshot from there if you need an image for a video edit or a post.

  • Requires: a SKILL.md-compatible agent environment and a web browser
  • Runs scripts: no
  • Uses network: no

Safety notes and tips

Because the skill runs no scripts and uses no network access, its effects are limited to the instructions it gives the agent and the HTML the agent writes. Still, review any generated HTML before you publish it, as you would with any agent output.

The skill sets clear limits: avoid blue-purple leaks, emoji, neon colours and geometric dashboard decoration. Use the reduced-motion setting if your viewers may prefer less movement, since the skill's guidance is to turn off animation for that preference.

  • Use real titles and content; the skill's guidance is to avoid lorem ipsum and placeholder images
  • Keep the palette to warm tones; the skill caps colours at four hues
  • For Chinese titles, the skill notes that Noto Serif SC italic is not available, so it uses the regular weight with wider letter spacing
  • Do not expect a video file: export a screenshot or record the page with your own tools if you need motion

What people use it for

  • Opening title card for a short film or documentary
  • Chapter title cards inside a longer documentary
  • Retro, analogue-style title screen prototypes in HTML for a designer
  • Moody cinematic banner for a video or product launch

Frequently asked questions

How do I install the frame-light-leak-cinema skill?

Download the ZIP from this page and unzip it. Place the folder in ~/.claude/skills/ for personal use or in a project's .claude/skills/ folder for one project. In the Claude apps, you can upload it under Settings → Capabilities → Skills.

Does this skill create video files?

No. The skill produces a single HTML frame. It does not render video or export animation, so you will need to screenshot the page or use your own tools for any motion.

What do I need to use it?

You need a SKILL.md-compatible agent environment and a web browser to view the HTML file. The skill's metadata says it does not run scripts and does not use the network.

Is the Light-Leak Cinematic Frame skill free?

The skill is published under the Apache-2.0 licence, as listed on this page. Check the licence file in the source repository for the full terms.

Can I use it for a blue or neon brand palette?

No. The skill explicitly forbids blue-purple leaks and neon colours. It is designed for warm orange, peach and amber tones, so it is a poor fit for cool or neon brand palettes.

Why does my Chinese title look different?

The skill notes that Noto Serif SC italic is not available, so it uses the regular weight with wider letter spacing for Chinese text.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Choose this skill if you want a quick, consistent vintage film title frame as HTML for a short film, documentary, chapter card or moody banner. Pick something else if you need an actual video file, animation export, or a cool blue or neon visual identity.

Download the skill