Skip to content
cccskills
FreePublished on GitHubEnglish overview

html-ppt-obsidian-claude-gradient

Builds an HTML presentation for enterprise AI adoption decisions, using a dark purple gradient template. It organizes local-first agent workflows, risk controls, return on investment, and rollout plans for leadership, IT, and security audiences.

OriginalShow the original description

OpenDesign's enterprise AI-adoption brief: local-first agents at work, the risk controls, the ROI, and the rollout plan. Built as a decision-grade AI literacy deck for leadership, IT, security.

nexu-io/open-design
AI rating100/ 100See how to install

Good for

  • Explaining an AI adoption proposal to leadership
  • Presenting risk controls to IT and security teams
  • Organizing return on investment and rollout plans
  • Preparing an AI briefing with speaker notes

Overview

What it does

html-ppt-obsidian-claude-gradient creates HTML slides to support enterprise AI adoption decisions. It covers business uses of agents that prioritize local environments, risk controls, return on investment, and rollout plans. Based on the dark purple gradient design of obsidian-claude-gradient, it handles the slide plan, slide text, visual direction, presentation structure, and content review.

When it helps

Use it to explain an adoption budget to leadership or review an implementation approach with IT and security teams. It helps organize the audience, the decision you want them to make, supporting materials, deadlines, and essential figures into a presentation that makes the proposed AI implementation concrete. Speaker notes and animations are also supported.

Example requests

  • “Create a presentation for leadership explaining the return on investment and rollout plan for AI adoption.”
  • “Prepare an adoption proposal for IT and security teams, including risk controls and speaker notes.”

Notes

Production requires the html-ppt master skill and shared CSS and JavaScript files. When copying the template, update its file references or embed the required files in the HTML. Keep the MIT license’s LICENSE file when redistributing.

This overview was written by AI (OpenAI Codex) from the public SKILL.md. Check the original below for the exact behavior.

Objective evaluation

AI rated this skill on four points using only the contents of its SKILL.md. Stars and popularity are not taken into account.

Clear instructionsIs it clear when to use it and what it does?
AGoodIt explicitly targets enterprise AI adoption presentations for leadership, IT, and security audiences.
Concrete stepsAre steps, inputs, outputs, and examples spelled out?
AGoodSteps cover copying the template, fixing shared asset references, and placing speaker notes.
SafetyAre sending data, deleting files, and running commands disclosed?
AGoodCopy destinations and reference changes are specified, with no instructions for external transmission or credential retrieval.
Easy setupDoes it need few tools or API keys, and are they documented?
AGoodIt provides the html-ppt reference, required shared files, and setup instructions for copying or embedding them.

The total counts each point as A = 25, B = 15, C = 5. Rated by AI (OpenAI Codex) as of Oct 20, 2026. Treat it as a guide and read the original before installing.

Disagree? Request a re-evaluation

Tell us which point is wrong and why. No login needed. We will check it against the SKILL.md, redo the evaluation, and show the result here.

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

Files included (2)

  • SKILL.md5.5 KB
  • example.html23.5 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

HTML PPT · GitHub 暗紫渐变

A focused entry point into the html-ppt master skill that lands the user directly on the obsidian-claude-gradient full-deck template.

When this card is picked

The Examples gallery wires "Use this prompt" to the example_prompt above. When you accept that prompt, this card is the right pick if the user wants exactly the visual identity of obsidian-claude-gradient (see the upstream full-decks catalog for screenshots and rationale).

How to author the deck

  1. Read the master skill first. All authoring rules live in design-templates/html-ppt/SKILL.md — content/audience checklist, token rules, layout reuse, presenter mode, the keyboard runtime, and the "never put presenter-only text on the slide" rule.
  2. Start from the matching template folder: design-templates/html-ppt/templates/full-decks/obsidian-claude-gradient/ — copy index.html and style.css into the project, keep the .tpl-obsidian-claude-gradient body class.
  3. Bring the shared runtime with the template. The upstream index.html links the shared CSS/JS via ../../../assets/... because it sits three folders deep inside design-templates/html-ppt/templates/full-decks/. Once you copy index.html into the project, those parent-relative URLs no longer resolve and base.css, animations.css, and runtime.js will 404 — meaning the deck never activates and slide navigation is dead. Pick one of these two recipes per project:
    • Recipe A — copy + rewrite (preferred): copy design-templates/html-ppt/assets/fonts.css, design-templates/html-ppt/assets/base.css, design-templates/html-ppt/assets/animations/animations.css, and design-templates/html-ppt/assets/runtime.js into a project-local assets/ (with assets/animations/animations.css), then rewrite the four <link>/<script> tags in index.html from ../../../assets/... to the matching project-local paths (assets/fonts.css, assets/base.css, assets/animations/animations.css, assets/runtime.js).
    • Recipe B — inline: read the same four files and replace each <link rel="stylesheet" href="../../../assets/..."> with a <style>...</style> containing the file's contents, and the <script src="../../../assets/runtime.js"> with a <script>...</script> containing runtime.js. Yields a single self-contained index.html. Either way, do not ship the upstream ../../../assets/... URLs verbatim into a project artifact — they only work in-tree.
  4. Pick a theme. Default tokens look fine; if the user wants a different feel, swap in any of the 36 themes from design-templates/html-ppt/assets/themes/*.css via <link id="theme-link"> and let T cycle.
  5. Replace demo content, not classes. The .tpl-obsidian-claude-gradient scoped CSS only recognises the structural classes shipped in the template — keep them.
  6. Speaker notes go inside <aside class="notes"> or <div class="notes"> — never as visible text on the slide.

Attribution

Visual system, layouts, themes and the runtime keyboard model come from the upstream MIT-licensed lewislulu/html-ppt-skill. The LICENSE file ships at design-templates/html-ppt/LICENSE; please keep it in place when redistributing.

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

8-bit-orbit-video-template

FreeSummaryAI rating 90

Create a three-scene video composition in a retro pixel style using a Hyperframes HTML template. Customize titles, labels, and colors while preserving scene transitions, short scene durations, and repeatable animation timing.

  • Create a retro pixel presentation video
  • Customize a three-scene video template
  • Preview scene transitions and motion in HTML
nexu-io/open-design103.1KUpdated Oct 22, 2026

ad-creative

FreeSummaryAI rating 80

Create and revise headlines, descriptions, and main text for paid social and search ads. Use it to develop ad copy options and refine wording through repeated rounds of revision.

  • Drafting headlines for paid social ads
  • Creating descriptions for search ads
  • Revising the main text of an ad
nexu-io/open-design103.1KUpdated Oct 22, 2026

after-hours-editorial-template

FreeSummaryAI rating 80

Create a three-page editorial motion sequence with dark backgrounds, serif typography, staged text reveals, and chapter transitions. The result is a single HTML file suited to fashion-inspired storytelling and short visual presentations.

  • Creating a fashion-inspired motion presentation
  • Presenting a short story across three pages
  • Applying existing brand rules to a dark editorial sequence
nexu-io/open-design103.1KUpdated Oct 22, 2026

agent-browser

FreeSummaryAI rating 100

Inspect and test web pages through a browser automation command-line tool. Navigate, click, enter text, capture screenshots, and extract page details, with a focus on checking local OpenDesign previews and reviewing web app quality.

  • Checking local OpenDesign previews
  • Testing clicks and text entry in web apps
  • Capturing page or element screenshots
nexu-io/open-design103.1KUpdated Oct 22, 2026

ai-music-album

FreeSummaryAI rating 80

Plan an AI music album from its concept through lyric drafts, track order, and export. Intended for independent album experiments and brand soundtracks, with the full production workflow provided through a separately installed upstream bundle.

  • Planning an experimental independent album
  • Drafting lyrics around an album concept
  • Deciding the running order of tracks
nexu-io/open-design103.1KUpdated Oct 22, 2026

algorithmic-art

FreeSummaryAI rating 80

Create generative art, or images made with programmed rules, using p5.js. Fixed random seeds make each rendering reproducible, supporting procedural posters, still images that suggest motion, and studies of artistic frame composition.

  • Posters generated with programmed rules
  • Still images that suggest motion
  • Studies of artistic frame composition
nexu-io/open-design103.1KUpdated Oct 22, 2026

See all skills by nexu-io

Report a problem with this skill