{"id":"c5a3a5e3-03e2-41d1-ac8b-d90af89609a6","shortId":"VWSc6B","kind":"skill","title":"vfx-text-cursor","tagline":"光标拖光 + 彩色像散射线 + 定向光斑, 适合视频片头逐字揭示金句","description":"【模板: VFX 文字光标 (Text Cursor)】\n【意图】视频开场/Hero 帧 —— 光标在画布上\"打字\", 文字逐字浮现, 后面拖着彩色像散尾迹 + 定向光斑。Inspired by hyperframes vfx-text-cursor。\n\n【画布】1920×1080, 背景 `#06070a` 暗哑黑 或 `#0a0d12` (有暖偏蓝); 加微妙 vignette。\n\n【内容】\n- 一句金句 (中英不限), 居中, 字号 6-8vw, weight 700, 字体 `Inter Tight` / `Source Sans 3` / `Noto Sans SC`。\n- 逐字揭示, 每个字符 80ms 间隔; 当前字符后面跟着一个 cursor `▍` (或细 vertical bar)。\n- 已揭示文字默认白色 `#f5f5f7`, opacity 1; 即将揭示位置加 chromatic ghost: 一份 `text-shadow: 2px 0 #ff3b6f, -2px 0 #00d4ff` 在 reveal 瞬间, 200ms 内收敛回正常。\n- 光标本身: 16px 宽矩形, 颜色 = accent (取 1: hot pink `#ff3b6f` / cyan `#00d4ff` / amber `#ffb547`), 闪烁 `@keyframes` 1.0s 周期; 后面拖一条 60-120px 的 motion blur trail (径向渐变到透明)。\n\n【光斑 / 射线】\n- 在打字位置附近随机生成 3-5 道**定向光斑** (light leak): 用 `linear-gradient(45deg, transparent, accent20, transparent)` 的细长矩形 + `mix-blend-mode: screen`, 不规则角度。\n- 当文字打完, 整段文字加 0.5s shimmer sweep (光带横扫)。\n\n【字段】\n- 顶部 caption (uppercase letterspace 0.18em, 11px, opacity 0.5): \"FRAME 01 · OPENING\"。\n- 文字底下副标 (24-28px, opacity 0.6): 来源 / 章节。\n- 右下角 timecode (`00:03:21` mono)。\n\n【设计细节】\n- **绝不**: 多色彩虹 chromatic (只用 1 个 hot pink + cyan 这种二元像散, 不要 R/G/B 全色)。\n- 字体: 西文 `Inter Tight` Bold; 中文 `Noto Sans SC` Bold; 严禁衬线。\n- 动效用 `@keyframes` + JS 计时器 (`setTimeout` 逐字), 可被 `prefers-reduced-motion` 关闭 (直接显示所有字)。\n- 必须用用户提供的金句; 不要捏造。\n- 单文件 HTML, 不要外链字体以外的资源。","tags":["vfx","text","cursor","open","design","nexu-io","agent-skills","ai-agents","ai-design","byok","claude","claude-code-for-design"],"capabilities":["skill","source-nexu-io","skill-vfx-text-cursor","topic-agent-skills","topic-ai-agents","topic-ai-design","topic-byok","topic-claude","topic-claude-code-for-design","topic-claude-design","topic-coding-agents","topic-design-systems","topic-design-tools","topic-desktop-app","topic-figma-alternative"],"categories":["open-design"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/nexu-io/open-design/vfx-text-cursor","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add nexu-io/open-design","source_repo":"https://github.com/nexu-io/open-design","install_from":"skills.sh"}},"qualityScore":"0.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 44905 github stars · SKILL.md body (1,292 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T18:50:19.987Z","embedding":null,"createdAt":"2026-05-15T12:50:36.522Z","updatedAt":"2026-05-18T18:50:19.987Z","lastSeenAt":"2026-05-18T18:50:19.987Z","tsv":"'-120':113 '-2':83 '-28':166 '-5':124 '-8':47 '/hero':16 '0':81,85 '0.18':156 '0.5':146,160 '0.6':169 '00':174 '00d4ff':86,103 '01':162 '03':175 '06070a':34 '0a0d12':37 '1':72,98,183 '1.0':108 '1080':32 '11px':158 '16px':93 '1920':31 '200ms':90 '21':176 '24':165 '2px':80 '3':56,123 '45deg':133 '6':46 '60':112 '700':50 '80ms':62 'accent':96 'accent20':135 'amber':104 'bar':68 'blend':140 'blur':117 'bold':196,201 'caption':153 'chromat':74,181 'cursor':4,13,29,65 'cyan':102,187 'em':157 'f5f5f7':70 'ff3b6f':82,101 'ffb547':105 'frame':161 'ghost':75 'gradient':132 'hot':99,185 'html':219 'hyperfram':25 'inspir':23 'inter':52,194 'js':205 'keyfram':107,204 'leak':128 'letterspac':155 'light':127 'linear':131 'linear-gradi':130 'mix':139 'mix-blend-mod':138 'mode':141 'mono':177 'motion':116,213 'noto':57,198 'opac':71,159,168 'open':163 'pink':100,186 'prefer':211 'prefers-reduced-mot':210 'px':84,114,167 'r/g/b':190 'reduc':212 'reveal':88 'san':55,58,199 'sc':59,200 'screen':142 'settimeout':207 'shadow':79 'shimmer':148 'skill' 'skill-vfx-text-cursor' 'sourc':54 'source-nexu-io' 'sweep':149 'text':3,12,28,78 'text-shadow':77 'tight':53,195 'timecod':173 'topic-agent-skills' 'topic-ai-agents' 'topic-ai-design' 'topic-byok' 'topic-claude' 'topic-claude-code-for-design' 'topic-claude-design' 'topic-coding-agents' 'topic-design-systems' 'topic-design-tools' 'topic-desktop-app' 'topic-figma-alternative' 'trail':118 'transpar':134,136 'uppercas':154 'vertic':67 'vfx':2,10,27 'vfx-text-cursor':1,26 'vignett':40 'vw':48 'weight':49 '一份':76 '一句金句':42 '不要':189 '不要外链字体以外的资源':220 '不要捏造':217 '不规则角度':143 '严禁衬线':202 '个':184 '中文':197 '中英不限':43 '光带横扫':150 '光斑':120 '光标在画布上':18 '光标拖光':5 '光标本身':92 '全色':191 '关闭':214 '内容':41 '内收敛回正常':91 '加微妙':39 '动效用':203 '单文件':218 '即将揭示位置加':73 '取':97 '只用':182 '可被':209 '右下角':172 '后面拖一条':111 '后面拖着彩色像散尾迹':21 '周期':110 '在':87 '在打字位置附近随机生成':122 '多色彩虹':180 '字体':51,192 '字号':45 '字段':151 '定向光斑':7,22,126 '宽矩形':94 '射线':121 '居中':44 '已揭示文字默认白色':69 '帧':17 '当前字符后面跟着一个':64 '当文字打完':144 '彩色像散射线':6 '径向渐变到透明':119 '必须用用户提供的金句':216 '意图':14 '或':36 '或细':66 '打字':19 '整段文字加':145 '文字光标':11 '文字底下副标':164 '文字逐字浮现':20 '暗哑黑':35 '有暖偏蓝':38 '来源':170 '模板':9 '每个字符':61 '用':129 '画布':30 '的':115 '的细长矩形':137 '直接显示所有字':215 '瞬间':89 '章节':171 '绝不':179 '背景':33 '西文':193 '视频开场':15 '计时器':206 '设计细节':178 '这种二元像散':188 '适合视频片头逐字揭示金句':8 '逐字':208 '逐字揭示':60 '道':125 '闪烁':106 '间隔':63 '顶部':152 '颜色':95","prices":[{"id":"2850c093-32e0-491b-b92c-3f032c6a898e","listingId":"c5a3a5e3-03e2-41d1-ac8b-d90af89609a6","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"nexu-io","category":"open-design","install_from":"skills.sh"},"createdAt":"2026-05-15T12:50:36.522Z"}],"sources":[{"listingId":"c5a3a5e3-03e2-41d1-ac8b-d90af89609a6","source":"github","sourceId":"nexu-io/open-design/vfx-text-cursor","sourceUrl":"https://github.com/nexu-io/open-design/tree/main/skills/vfx-text-cursor","isPrimary":false,"firstSeenAt":"2026-05-15T12:50:36.522Z","lastSeenAt":"2026-05-18T18:50:19.987Z"}],"details":{"listingId":"c5a3a5e3-03e2-41d1-ac8b-d90af89609a6","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"nexu-io","slug":"vfx-text-cursor","github":{"repo":"nexu-io/open-design","stars":44905,"topics":["agent-skills","ai-agents","ai-design","byok","claude","claude-code-for-design","claude-design","coding-agents","design-systems","design-tools","desktop-app","figma-alternative","generative-ai","hermes-agent","local-first","nextjs","no-code","prototyping","ui-generator","vibe-coding"],"license":"apache-2.0","html_url":"https://github.com/nexu-io/open-design","pushed_at":"2026-05-18T18:43:11Z","description":"🎨 Local-first, open-source alternative to Anthropic's Claude Design. ⚡ 19 Skills · ✨ 71 brand-grade Design Systems 🖼 Generate web · desktop · mobile prototypes · slides · images · videos · HyperFrames 📦 Sandboxed preview · HTML/PDF/PPTX/MP4 export 🤖 Runs on Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen / Copilot / Hermes / Kimi CLI.","skill_md_sha":"c672a5b14bbd74ffadf52acbf9ac080bc3b3a04e","skill_md_path":"skills/vfx-text-cursor/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/nexu-io/open-design/tree/main/skills/vfx-text-cursor"},"layout":"multi","source":"github","category":"open-design","frontmatter":{"name":"vfx-text-cursor","description":"光标拖光 + 彩色像散射线 + 定向光斑, 适合视频片头逐字揭示金句"},"skills_sh_url":"https://skills.sh/nexu-io/open-design/vfx-text-cursor"},"updatedAt":"2026-05-18T18:50:19.987Z"}}