{"id":"fe0a0a78-8e24-4a93-9f0b-b9690ab7eb39","shortId":"GQQ69p","kind":"skill","title":"html-ppt-zhangzara-playful","tagline":"Playful — Sun-warm peach background with Syne display: a friendly indie launch deck. Anything that should feel warm, indie, and approachable: creator portfolios, indie product launches, lifestyle brands, small-business pitches, newsletter / community decks.","description":"# Playful\n\n> Sun-warm peach background with Syne display: a friendly indie launch deck.\n\nA single self-contained HTML deck — typography, palette, decorative system,\nand slide vocabulary are all tuned together. Mixing layouts across templates\nbreaks the system; stay inside this one.\n\n## At a glance\n\n- **Scheme:** light\n- **Formality:** low\n- **Density:** medium\n- **Slides in demo:** 10\n\n## Best for\n\nAnything that should feel warm, indie, and approachable: creator portfolios, indie product launches, lifestyle brands, small-business pitches, newsletter / community decks. Also welcoming for any deck — including tech or research — that wants to feel friendly and human rather than corporate.\n\n## Avoid for\n\nContexts where institutional credibility matters more than warmth — the peach palette is intentionally informal.\n\n## Workflow\n\n1. **Clone `example.html`** into the user's workspace as the working file.\n2. **Replace placeholder content** with the user's real headlines, body copy,\n numbers, names, dates, and section labels. Match existing dimensions when\n swapping image placeholders.\n3. **Preserve the design system.** Never substitute fonts, recolor the palette,\n restructure the layout grid, or strip decorative elements (corner brackets,\n paper grain, geometric shapes, illustrated SVGs). They are part of the\n identity.\n4. **Adjust deck length by duplicating layouts.** If the user has more content\n than the demo holds, duplicate an existing slide of the most appropriate\n layout. If less, drop slides from the bottom. Update page-number labels.\n5. **Designing missing layouts:** if a slide needs a layout the template\n doesn't have, design it from scratch using the same fonts, palette,\n decorative vocabulary, spacing rhythm, and component grammar — never bail\n to a different template.\n6. **Keep the navigation runtime as shipped.** If the deck ships an\n `assets/deck-stage.js` or inline keyboard handler, leave it intact.\n\n## Output contract\n\nEmit between `` tags:\n\n```\n\n\n...\n\n```\n\n## Source & license\n\nVendored from upstream MIT-licensed\n[`zarazhangrui/beautiful-html-templates`](https://github.com/zarazhangrui/beautiful-html-templates/tree/main/templates/playful).\n\nThe full upstream MIT license text — including the original copyright notice — ships in this skill at\n[`LICENSE`](./LICENSE) and must be redistributed alongside any copy of `example.html`,\n`template.json`, or any vendored `assets/` runtime. See `template.json` for the upstream metadata snapshot.","tags":["html","ppt","zhangzara","playful","open","design","nexu-io","agent-skills","ai-agents","ai-design","byok","claude"],"capabilities":["skill","source-nexu-io","skill-html-ppt-zhangzara-playful","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/html-ppt-zhangzara-playful","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 · 36607 github stars · SKILL.md body (2,633 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-11T06:52:23.505Z","embedding":null,"createdAt":"2026-05-08T06:51:50.161Z","updatedAt":"2026-05-11T06:52:23.505Z","lastSeenAt":"2026-05-11T06:52:23.505Z","tsv":"'/license':357 '/zarazhangrui/beautiful-html-templates/tree/main/templates/playful).':339 '1':158 '10':97 '2':170 '3':195 '4':228 '5':266 '6':303 'across':76 'adjust':229 'alongsid':362 'also':122 'anyth':20,100 'approach':27,107 'appropri':252 'asset':371 'assets/deck-stage.js':315 'avoid':141 'background':11,47 'bail':298 'best':98 'bodi':180 'bottom':260 'bracket':215 'brand':34,114 'break':78 'busi':37,117 'clone':159 'communiti':40,120 'compon':295 'contain':60 'content':173,240 'context':143 'contract':324 'copi':181,364 'copyright':349 'corner':214 'corpor':140 'creator':28,108 'credibl':146 'date':184 'deck':19,41,55,62,121,126,230,312 'decor':65,212,290 'demo':96,243 'densiti':92 'design':198,267,281 'differ':301 'dimens':190 'display':14,50 'doesn':278 'drop':256 'duplic':233,245 'element':213 'emit':325 'example.html':160,366 'exist':189,247 'feel':23,103,134 'file':169 'font':202,288 'formal':90 'friend':16,52,135 'full':341 'geometr':218 'github.com':338 'github.com/zarazhangrui/beautiful-html-templates/tree/main/templates/playful).':337 'glanc':87 'grain':217 'grammar':296 'grid':209 'handler':319 'headlin':179 'hold':244 'html':2,61 'html-ppt-zhangzara-play':1 'human':137 'ident':227 'illustr':220 'imag':193 'includ':127,346 'indi':17,25,30,53,105,110 'inform':156 'inlin':317 'insid':82 'institut':145 'intact':322 'intent':155 'keep':304 'keyboard':318 'label':187,265 'launch':18,32,54,112 'layout':75,208,234,253,269,275 'leav':320 'length':231 'less':255 'licens':329,335,344,356 'lifestyl':33,113 'light':89 'low':91 'match':188 'matter':147 'medium':93 'metadata':378 'miss':268 'mit':334,343 'mit-licens':333 'mix':74 'must':359 'name':183 'navig':306 'need':273 'never':200,297 'newslett':39,119 'notic':350 'number':182,264 'one':84 'origin':348 'output':323 'page':263 'page-numb':262 'palett':64,153,205,289 'paper':216 'part':224 'peach':10,46,152 'pitch':38,118 'placehold':172,194 'play':5,6,42 'portfolio':29,109 'ppt':3 'preserv':196 'product':31,111 'rather':138 'real':178 'recolor':203 'redistribut':361 'replac':171 'research':130 'restructur':206 'rhythm':293 'runtim':307,372 'scheme':88 'scratch':284 'section':186 'see':373 'self':59 'self-contain':58 'shape':219 'ship':309,313,351 'singl':57 'skill':354 'skill-html-ppt-zhangzara-playful' 'slide':68,94,248,257,272 'small':36,116 'small-busi':35,115 'snapshot':379 'sourc':328 'source-nexu-io' 'space':292 'stay':81 'strip':211 'substitut':201 'sun':8,44 'sun-warm':7,43 'svgs':221 'swap':192 'syne':13,49 'system':66,80,199 'tag':327 'tech':128 'templat':77,277,302 'template.json':367,374 'text':345 'togeth':73 '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' 'tune':72 'typographi':63 'updat':261 'upstream':332,342,377 'use':285 'user':163,176,237 'vendor':330,370 'vocabulari':69,291 'want':132 'warm':9,24,45,104 'warmth':150 'welcom':123 'work':168 'workflow':157 'workspac':165 'zarazhangrui/beautiful-html-templates':336 'zhangzara':4","prices":[{"id":"0472d369-ce81-456d-b352-4f8d842f7804","listingId":"fe0a0a78-8e24-4a93-9f0b-b9690ab7eb39","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-08T06:51:50.161Z"}],"sources":[{"listingId":"fe0a0a78-8e24-4a93-9f0b-b9690ab7eb39","source":"github","sourceId":"nexu-io/open-design/html-ppt-zhangzara-playful","sourceUrl":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-playful","isPrimary":false,"firstSeenAt":"2026-05-08T06:51:50.161Z","lastSeenAt":"2026-05-11T06:52:23.505Z"}],"details":{"listingId":"fe0a0a78-8e24-4a93-9f0b-b9690ab7eb39","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"nexu-io","slug":"html-ppt-zhangzara-playful","github":{"repo":"nexu-io/open-design","stars":36607,"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-11T06:48:43Z","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":"f76469b7772427bca6a02aebe80d178fd63db8d0","skill_md_path":"skills/html-ppt-zhangzara-playful/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-playful"},"layout":"multi","source":"github","category":"open-design","frontmatter":{"name":"html-ppt-zhangzara-playful","description":"Playful — Sun-warm peach background with Syne display: a friendly indie launch deck. Anything that should feel warm, indie, and approachable: creator portfolios, indie product launches, lifestyle brands, small-business pitches, newsletter / community decks."},"skills_sh_url":"https://skills.sh/nexu-io/open-design/html-ppt-zhangzara-playful"},"updatedAt":"2026-05-11T06:52:23.505Z"}}