{"id":"ab83771c-09b1-423b-9816-2081153af308","shortId":"bJA2vU","kind":"skill","title":"html-ppt-zhangzara-retro-zine","tagline":"Retro Zine — Beige paper with green accent and Bebas Neue + Caveat: a riso-printed zine in HTML form. Anything that should feel printed, lo-fi, and crafted: indie zines and publications, music / arts brands, creator portfolios, small-batch craft launches, community decks.","description":"# Retro Zine\n\n> Beige paper with green accent and Bebas Neue + Caveat: a riso-printed zine in HTML form.\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:** medium-low\n- **Density:** medium\n- **Slides in demo:** 10\n\n## Best for\n\nAnything that should feel printed, lo-fi, and crafted: indie zines and publications, music / arts brands, creator portfolios, small-batch craft launches, community decks. Also a great underdog choice for tech, research, or business decks that want a riso-print warmth instead of digital polish.\n\n## Avoid for\n\nContexts that demand digital-native polish or fast modern-tech energy — the layered zine aesthetic intentionally feels handmade.\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 `<artifact>` tags:\n\n```\n<artifact identifier=\"zhangzara-retro-zine\" type=\"text/html\" title=\"Deck Title\">\n<!doctype html>\n<html>...</html>\n</artifact>\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/retro-zine).\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","retro","zine","open","design","nexu-io","agent-skills","ai-agents","ai-design","byok"],"capabilities":["skill","source-nexu-io","skill-html-ppt-zhangzara-retro-zine","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-retro-zine","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,681 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.723Z","embedding":null,"createdAt":"2026-05-08T06:51:50.388Z","updatedAt":"2026-05-11T06:52:23.723Z","lastSeenAt":"2026-05-11T06:52:23.723Z","tsv":"'/license':387 '/zarazhangrui/beautiful-html-templates/tree/main/templates/retro-zine).':369 '1':188 '10':114 '2':200 '3':225 '4':258 '5':296 '6':333 'accent':13,58 'across':91 'adjust':259 'aesthet':183 'alongsid':392 'also':143 'anyth':26,117 'appropri':282 'art':41,132 'asset':401 'assets/deck-stage.js':345 'avoid':165 'bail':328 'batch':47,138 'beba':15,60 'beig':9,54 'best':115 'bodi':210 'bottom':290 'bracket':245 'brand':42,133 'break':93 'busi':152 'caveat':17,62 'choic':147 'clone':189 'communiti':50,141 'compon':325 'contain':75 'content':203,270 'context':167 'contract':354 'copi':211,394 'copyright':379 'corner':244 'craft':35,48,126,139 'creator':43,134 'date':214 'deck':51,77,142,153,260,342 'decor':80,242,320 'demand':169 'demo':113,273 'densiti':109 'design':228,297,311 'differ':331 'digit':163,171 'digital-n':170 'dimens':220 'doesn':308 'drop':286 'duplic':263,275 'element':243 'emit':355 'energi':179 'example.html':190,396 'exist':219,277 'fast':175 'feel':29,120,185 'fi':33,124 'file':199 'font':232,318 'form':25,70 'formal':105 'full':371 'geometr':248 'github.com':368 'github.com/zarazhangrui/beautiful-html-templates/tree/main/templates/retro-zine).':367 'glanc':102 'grain':247 'grammar':326 'great':145 'green':12,57 'grid':239 'handler':349 'handmad':186 'headlin':209 'hold':274 'html':2,24,69,76 'html-ppt-zhangzara-retro-zin':1 'ident':257 'illustr':250 'imag':223 'includ':376 'indi':36,127 'inlin':347 'insid':97 'instead':161 'intact':352 'intent':184 'keep':334 'keyboard':348 'label':217,295 'launch':49,140 'layer':181 'layout':90,238,264,283,299,305 'leav':350 'length':261 'less':285 'licens':359,365,374,386 'light':104 'lo':32,123 'lo-fi':31,122 'low':108 'match':218 'medium':107,110 'medium-low':106 'metadata':408 'miss':298 'mit':364,373 'mit-licens':363 'mix':89 'modern':177 'modern-tech':176 'music':40,131 'must':389 'name':213 'nativ':172 'navig':336 'need':303 'neue':16,61 'never':230,327 'notic':380 'number':212,294 'one':99 'origin':378 'output':353 'page':293 'page-numb':292 'palett':79,235,319 'paper':10,55,246 'part':254 'placehold':202,224 'polish':164,173 'portfolio':44,135 'ppt':3 'preserv':226 'print':21,30,66,121,159 'public':39,130 'real':208 'recolor':233 'redistribut':391 'replac':201 'research':150 'restructur':236 'retro':5,7,52 'rhythm':323 'riso':20,65,158 'riso-print':19,64,157 'runtim':337,402 'scheme':103 'scratch':314 'section':216 'see':403 'self':74 'self-contain':73 'shape':249 'ship':339,343,381 'singl':72 'skill':384 'skill-html-ppt-zhangzara-retro-zine' 'slide':83,111,278,287,302 'small':46,137 'small-batch':45,136 'snapshot':409 'sourc':358 'source-nexu-io' 'space':322 'stay':96 'strip':241 'substitut':231 'svgs':251 'swap':222 'system':81,95,229 'tag':357 'tech':149,178 'templat':92,307,332 'template.json':397,404 'text':375 'togeth':88 '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':87 'typographi':78 'underdog':146 'updat':291 'upstream':362,372,407 'use':315 'user':193,206,267 'vendor':360,400 'vocabulari':84,321 'want':155 'warmth':160 'work':198 'workflow':187 'workspac':195 'zarazhangrui/beautiful-html-templates':366 'zhangzara':4 'zine':6,8,22,37,53,67,128,182","prices":[{"id":"293e3194-3214-477e-aa91-f2dda8afe3b2","listingId":"ab83771c-09b1-423b-9816-2081153af308","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.388Z"}],"sources":[{"listingId":"ab83771c-09b1-423b-9816-2081153af308","source":"github","sourceId":"nexu-io/open-design/html-ppt-zhangzara-retro-zine","sourceUrl":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-retro-zine","isPrimary":false,"firstSeenAt":"2026-05-08T06:51:50.388Z","lastSeenAt":"2026-05-11T06:52:23.723Z"}],"details":{"listingId":"ab83771c-09b1-423b-9816-2081153af308","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"nexu-io","slug":"html-ppt-zhangzara-retro-zine","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":"1084779345b473b7f6f8ead39ef2557f7c543345","skill_md_path":"skills/html-ppt-zhangzara-retro-zine/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-retro-zine"},"layout":"multi","source":"github","category":"open-design","frontmatter":{"name":"html-ppt-zhangzara-retro-zine","description":"Retro Zine — Beige paper with green accent and Bebas Neue + Caveat: a riso-printed zine in HTML form. Anything that should feel printed, lo-fi, and crafted: indie zines and publications, music / arts brands, creator portfolios, small-batch craft launches, community decks."},"skills_sh_url":"https://skills.sh/nexu-io/open-design/html-ppt-zhangzara-retro-zine"},"updatedAt":"2026-05-11T06:52:23.723Z"}}