Skip to content

Obsidian Claude Gradient Deck

Builds a dark, GitHub-style developer slide deck with gradient titles and code blocks

Stars
9,376
Licence
Apache-2.0
Files
2 files

What it does

This skill gives the agent a visual template for making slide presentations in a dark, developer-blog look: near-black background, purple and blue glow, gradient headings in purple, blue and green, and code blocks styled like GitHub. Once installed, when you ask for a technical tutorial deck, the agent follows this layout and styling instead of a generic one. The skill is a style guide with one example HTML file, not a tool that does anything on its own.

Great for

  • Developers who want a tutorial or changelog-style slide deck with a GitHub-like look
  • Engineers preparing a technical talk about a software project
  • Anyone who wants a dark, modern presentation style for coding content

Skip it if

  • Business decks needing corporate branding, since the style is fixed to a dark developer theme
  • Printed materials or light-background designs, since the template is dark-only

Try asking

  • “Make a 16:9 slide deck explaining how our REST API authentication works, in a dark GitHub style”
  • “Create a short tutorial deck on Git rebase with code blocks and a purple highlight for key points”
  • “Build a changelog presentation for our v2 release using the dark gradient-title layout”
Step-by-step guide: how to use Obsidian Claude Gradient DeckInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the Apache-2.0 licence and an attribution note.

    deck-obsidian-claude.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip deck-obsidian-claude.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip deck-obsidian-claude.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Say the topic and slide count up front so the agent can apply the centred layout and pill tags consistently.
  • Open example.html in a browser to preview the look before asking for a full deck.
  • If you need a different colour scheme, name the colours you want, since this skill's palette is fixed.

What's inside

  • example.html
  • SKILL.md

Redistributed unmodified from nexu-io/html-anything under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.