{"id":"b889a7ef-0e6a-42b1-b20c-a5a5157fda70","shortId":"5qDSJH","kind":"skill","title":"html-ppt-zhangzara-blue-professional","tagline":"Blue Professional — Cream paper background with electric cobalt blue accents; clean modern professional. Anything that should feel modern-considered and lightly authoritative: B2B SaaS pitches, consulting deliverables, advisory updates, investor reports.","description":"# Blue Professional\n\n> Cream paper background with electric cobalt blue accents; clean modern professional.\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-high\n- **Density:** medium\n- **Slides in demo:** 10\n\n## Best for\n\nAnything that should feel modern-considered and lightly authoritative: B2B SaaS pitches, consulting deliverables, advisory updates, investor reports. Also a clean, tasteful choice whenever you want to read as professional without going stiff — research synthesis, internal reviews, brand work for service businesses.\n\n## Avoid for\n\nContexts where the deck should feel hot, playful, or intentionally informal — the cool electric-blue restraint will read as overly polished.\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-blue-professional\" 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/blue-professional).\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","blue","professional","open","design","nexu-io","agent-skills","ai-agents","ai-design","byok"],"capabilities":["skill","source-nexu-io","skill-html-ppt-zhangzara-blue-professional","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-blue-professional","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,733 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:22.093Z","embedding":null,"createdAt":"2026-05-08T06:51:48.778Z","updatedAt":"2026-05-11T06:52:22.093Z","lastSeenAt":"2026-05-11T06:52:22.093Z","tsv":"'/license':365 '/zarazhangrui/beautiful-html-templates/tree/main/templates/blue-professional).':347 '1':166 '10':95 '2':178 '3':203 '4':236 '5':274 '6':311 'accent':16,48 'across':72 'adjust':237 'advisori':35,113 'alongsid':370 'also':117 'anyth':20,98 'appropri':260 'asset':379 'assets/deck-stage.js':323 'authorit':29,107 'avoid':141 'b2b':30,108 'background':11,43 'bail':306 'best':96 'blue':5,7,15,39,47,158 'bodi':188 'bottom':268 'bracket':223 'brand':136 'break':74 'busi':140 'choic':121 'clean':17,49,119 'clone':167 'cobalt':14,46 'compon':303 'consid':26,104 'consult':33,111 'contain':56 'content':181,248 'context':143 'contract':332 'cool':155 'copi':189,372 'copyright':357 'corner':222 'cream':9,41 'date':192 'deck':58,146,238,320 'decor':61,220,298 'deliver':34,112 'demo':94,251 'densiti':90 'design':206,275,289 'differ':309 'dimens':198 'doesn':286 'drop':264 'duplic':241,253 'electr':13,45,157 'electric-blu':156 'element':221 'emit':333 'example.html':168,374 'exist':197,255 'feel':23,101,148 'file':177 'font':210,296 'formal':86 'full':349 'geometr':226 'github.com':346 'github.com/zarazhangrui/beautiful-html-templates/tree/main/templates/blue-professional).':345 'glanc':83 'go':130 'grain':225 'grammar':304 'grid':217 'handler':327 'headlin':187 'high':89 'hold':252 'hot':149 'html':2,57 'html-ppt-zhangzara-blue-profession':1 'ident':235 'illustr':228 'imag':201 'includ':354 'inform':153 'inlin':325 'insid':78 'intact':330 'intent':152 'intern':134 'investor':37,115 'keep':312 'keyboard':326 'label':195,273 'layout':71,216,242,261,277,283 'leav':328 'length':239 'less':263 'licens':337,343,352,364 'light':28,85,106 'match':196 'medium':88,91 'medium-high':87 'metadata':386 'miss':276 'mit':342,351 'mit-licens':341 'mix':70 'modern':18,25,50,103 'modern-consid':24,102 'must':367 'name':191 'navig':314 'need':281 'never':208,305 'notic':358 'number':190,272 'one':80 'origin':356 'output':331 'over':163 'page':271 'page-numb':270 'palett':60,213,297 'paper':10,42,224 'part':232 'pitch':32,110 'placehold':180,202 'play':150 'polish':164 'ppt':3 'preserv':204 'profession':6,8,19,40,51,128 'read':126,161 'real':186 'recolor':211 'redistribut':369 'replac':179 'report':38,116 'research':132 'restraint':159 'restructur':214 'review':135 'rhythm':301 'runtim':315,380 'saa':31,109 'scheme':84 'scratch':292 'section':194 'see':381 'self':55 'self-contain':54 'servic':139 'shape':227 'ship':317,321,359 'singl':53 'skill':362 'skill-html-ppt-zhangzara-blue-professional' 'slide':64,92,256,265,280 'snapshot':387 'sourc':336 'source-nexu-io' 'space':300 'stay':77 'stiff':131 'strip':219 'substitut':209 'svgs':229 'swap':200 'synthesi':133 'system':62,76,207 'tag':335 'tast':120 'templat':73,285,310 'template.json':375,382 'text':353 'togeth':69 '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':68 'typographi':59 'updat':36,114,269 'upstream':340,350,385 'use':293 'user':171,184,245 'vendor':338,378 'vocabulari':65,299 'want':124 'whenev':122 'without':129 'work':137,176 'workflow':165 'workspac':173 'zarazhangrui/beautiful-html-templates':344 'zhangzara':4","prices":[{"id":"975356f7-5bda-42bc-a373-8dd71247bac9","listingId":"b889a7ef-0e6a-42b1-b20c-a5a5157fda70","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:48.778Z"}],"sources":[{"listingId":"b889a7ef-0e6a-42b1-b20c-a5a5157fda70","source":"github","sourceId":"nexu-io/open-design/html-ppt-zhangzara-blue-professional","sourceUrl":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-blue-professional","isPrimary":false,"firstSeenAt":"2026-05-08T06:51:48.778Z","lastSeenAt":"2026-05-11T06:52:22.093Z"}],"details":{"listingId":"b889a7ef-0e6a-42b1-b20c-a5a5157fda70","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"nexu-io","slug":"html-ppt-zhangzara-blue-professional","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":"8be2c4ea02b15951fbe13822b4b937e3fdf40e33","skill_md_path":"skills/html-ppt-zhangzara-blue-professional/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/nexu-io/open-design/tree/main/skills/html-ppt-zhangzara-blue-professional"},"layout":"multi","source":"github","category":"open-design","frontmatter":{"name":"html-ppt-zhangzara-blue-professional","description":"Blue Professional — Cream paper background with electric cobalt blue accents; clean modern professional. Anything that should feel modern-considered and lightly authoritative: B2B SaaS pitches, consulting deliverables, advisory updates, investor reports."},"skills_sh_url":"https://skills.sh/nexu-io/open-design/html-ppt-zhangzara-blue-professional"},"updatedAt":"2026-05-11T06:52:22.093Z"}}