Create cinematic opening frames and chapter cards with warm light leaks, film grain, and large serif titles. The template produces a single HTML file with widescreen framing and optional subtle motion.
Film light leaks, grain, 16:9 letterbox, and large serif type for cinematic openings or chapter cards.
frame-light-leak-cinema creates opening frames for documentaries and personal short films, as well as video chapter cards, with a classic film texture. It combines a dark background, warm orange light leaks, 35mm-style grain, and large serif titles in a single HTML file. Choose a wide 2.39:1 composition with black bars above and below, or a 16:9 composition without bars.
Use it to give a film title or chapter heading a cinematic appearance. You can include a subtitle, filming location, and date, and add decorative scratches or details resembling film sprocket holes. The design also specifies an entrance that brightens from darkness and slowly moving light leaks.
It uses your supplied title and bases year, chapter, and location information on your content. The design allows up to four hues and uses warm colors for light leaks. Animations stop when prefers-reduced-motion is enabled. The output is a single HTML file.
This overview was written by AI (OpenAI Codex) from the public SKILL.md. Check the original below for the exact behavior.
AI rated this skill on four points using only the contents of its SKILL.md. Stars and popularity are not taken into account.
The total counts each point as A = 25, B = 15, C = 5. Rated by AI (OpenAI Codex) as of Oct 20, 2026. Treat it as a guide and read the original before installing.
Review the instructions the agent will receive before you install.
【模板: 胶片漏光电影帧】 【意图】纪录片 / 个人短片 / 视频章节卡的开场单帧 —— 暖橙漏光 + 35mm 颗粒 + 衬线大字, 古典胶片质感。Inspired by hyperframes light-leak。
【画布】
#000)。【背景】
#1a0d08 / 墨绿 #0a1410 / 蓝紫 #0d0e1a) 或场景描绘 (CSS gradient 模拟天空 / 室内 / 室外)。radial-gradient(ellipse at top right, #ffb547 0%, transparent 50%) + 1 个底部 linear-gradient(to top, #d97757 0%, transparent 30%); 颜色取暖橙 / 桃 / 玫红 / 暗黄, 不要冷蓝。mix-blend-mode: overlay; 也可用 background-image: url("data:image/svg+xml,...feTurbulence...")。feDisplacementMap 模拟胶片摆动 (慎用)。【文字】
#f5e9d6 或 cream。【可选附加】
box-shadow 多重 inset 或多个 <div>)。【设计细节】
Noto Serif SC italic 不存在 → 用 Noto Serif SC regular + 字距加大。prefers-reduced-motion 关动效。No reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Create a three-scene video composition in a retro pixel style using a Hyperframes HTML template. Customize titles, labels, and colors while preserving scene transitions, short scene durations, and repeatable animation timing.
Create and revise headlines, descriptions, and main text for paid social and search ads. Use it to develop ad copy options and refine wording through repeated rounds of revision.
Create a three-page editorial motion sequence with dark backgrounds, serif typography, staged text reveals, and chapter transitions. The result is a single HTML file suited to fashion-inspired storytelling and short visual presentations.
Inspect and test web pages through a browser automation command-line tool. Navigate, click, enter text, capture screenshots, and extract page details, with a focus on checking local OpenDesign previews and reviewing web app quality.
Plan an AI music album from its concept through lyric drafts, track order, and export. Intended for independent album experiments and brand soundtracks, with the full production workflow provided through a separately installed upstream bundle.
Create generative art, or images made with programmed rules, using p5.js. Fixed random seeds make each rendering reproducible, supporting procedural posters, still images that suggest motion, and studies of artistic frame composition.