Individual skill
frame-electric-studio
Two-panel split with quote as hero — white/blue panels open from center, accent bar grows, quote reveals line by line.
templates/frame-electric-studio/SKILL.md
Source commit c414ecc07f795add03807d5d9ce4baefd807cea2
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- Yes
- Repository scan complete
- No
- Skill scan complete
- Yes
- Observed behavior
- Local scripts
- Last checked
- Nov 9, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 4,823
- Repository last updated
- Jun 21, 2026
- License
- Apache-2.0
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- ai-agent Repository topic
- apache-2 Repository topic
- coding-agent Repository topic
- css Repository topic
- ffmpeg Repository topic
- html Repository topic
- mp4 Repository topic
- open-design Repository topic
- open-source Repository topic
- video Repository topic
- split-panel Declared skill tag
- quote Declared skill tag
- blue Declared skill tag
- high-contrast Declared skill tag
- studio Declared skill tag
- frame Declared skill tag
- engineering Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
SKILL.mdcore · 3,338 bytesexample.mddoc · 257 bytespackage.jsonruns · 366 bytespreview.pngasset · 50,036 bytessource/index.htmlasset · 4,030 bytestemplate.html-video.yamlasset · 3,324 bytes
Read excerpt
【模板: 电光工作室分屏帧 (Electric Studio)】
【意图】pull-quote / 推荐语 / 使命陈述 / 高对比标题。视觉提炼自 frontend-slides 的 Electric Studio 预设 (MIT, © Zara Zhang)。
【画布】1920×1080, 白色上屏 (540px) + 电光蓝下屏 (`#4361ee`, 540px), 中线分割。
【字体】display + body 都用 `Manrope` 800/700/500/400。
【主结构 (时间轴, 默认 4s)】
- **0.1s** 上屏从 translateY(-100%) 下落、下屏从 translateY(100%) 上升, 同时从中心"开合"到位 (expo-out)。
- **0.9s** 接缝处黑色 accent 条 (高 8px) 从宽 0 → 320px 生长。
- **1.0s 起** 引言逐行浮现 (每行 .ln, 错峰 150ms, translateY 26→0); 跨入蓝屏的行用白色 (`.on-blue`)。font-size 96px, weight 800。
- **2.2s** 下屏 attribution (name 28px 700 + role uppercase 0.7 opacity, 白色) 淡入。
- **2.5s** 右上品牌 mark (深色) + 右下品牌 mark (白 0.6) 淡入。
