Skip to content
Skillpedia
Writing101k · #587

ve-terminal-mono

Creates a presentation on using the 'OpenDesign' tool via the command line. It's aimed at developers and power users, teaching automation and workflow.

What it does

This plugin creates presentations with an old computer terminal look. It uses monospace fonts, dark colors, and a dot grid for a clean, focused style.

When to use it

  • ✓To create presentations with a minimalist and technical design.
  • ✓When presenting code or data in a visually organized way.
  • ✓To develop training materials for developers or power users.

Example of what to ask your AI

“Create a presentation about the Terminal Mono design principles.”

Want more? Open the sections below.

How to use

The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.

Skill link

https://github.com/nexu-io/open-design/blob/main/plugins/_official/examples/ve-terminal-mono/SKILL.md

Ready-to-paste message

Use this skill to help me: https://github.com/nexu-io/open-design/blob/main/plugins/_official/examples/ve-terminal-mono/SKILL.md Read the SKILL.md file at that link and follow its instructions for my task.
How it works

It works by defining a fixed set of colors, fonts, and visual elements. You can create your presentations by copying the example file and replacing only the slide content.

Installation

Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.

In the terminal (Claude Code, Codex, Cursor), in your project folder:

npx skills add nexu-io/open-design --skill ve-terminal-mono

Or download just the file:

curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/_official/examples/ve-terminal-mono/SKILL.md -o SKILL.md
Technical content (original SKILL.md)

Original text by the author, straight from GitHub.

Terminal Mono(等宽终端)

A locked, single-theme deck plugin derived from the MIT-licensed nicobailon/visual-explainer slide-deck template, restyled with the Terminal Mono aesthetic from its references/slide-patterns.md. Developer-native and typographically strict: near-black ground, monospace everything, one green voice, a faint dot grid.

Zero skeuomorphism, zero effects. No $ prompts, no red/yellow/green window chrome, no CRT scanlines, no vignettes, no glows. This theme stands on typographic discipline and the dot-grid texture alone. (The skeuomorphic "terminal theater" look belongs to a different plugin — do not drift there.)

Start from example.html in this plugin folder. It is the proven seed: copy its :root tokens (both themes), deck/slide CSS, dot-grid treatment, and the entire SlideEngine script verbatim, then replace only the slide content. Do not rewrite the design system, and do not introduce any color or font outside this spec.

Design tokens (locked — list verbatim in :root)

Dark is the default theme; light mode switches automatically via prefers-color-scheme: light. Both blocks are part of the locked spec — dual-theme support is the visual-explainer family signature and must ship in every deck.

:root {
  --font-body: 'Geist Mono', 'SF Mono', Consolas, monospace;
  --font-mono: 'Geist Mono', 'SF Mono', Consolas, monospace;
  --bg: #0a0e14;                         /* near-black ground */
  --surface: #12161e;
  --surface2: #1a1f2a;
  --surface-elevated: #222836;
  --border: rgba(80, 250, 123, 0.06);    /* low-opacity green hairline */
  --border-bright: rgba(80, 250, 123, 0.12);
  --text: #c8d6e5;
  --text-dim: #7d8c9b;                   /* AA on --bg for body text */
  --accent: #50fa7b;                     /* Dracula green — the only voice */
  --accent-dim: rgba(80, 250, 123, 0.08);
  --code-bg: #060a10;
  --code-text: #c8d6e5;
  --dot: rgba(80, 250, 123, 0.05);       /* dot-grid ink */
}

@media (prefers-color-scheme: light) {
  :root {
    --bg: #f4f6f8;
    --surface: #ffffff;
    --surface2: #eaecf0;
    --surface-elevated: #f8f9fa;
    --border: rgba(0, 80, 40, 0.08);
    --border-bright: rgba(0, 80, 40, 0.16);
    --text: #1a2332;
    --text-dim: #5a6a7a;
    --accent: #0d7a3e;                   /* deep green for light ground */
    --accent-dim: rgba(13, 122, 62, 0.08);
    --code-bg: #1a2332;                  /* code blocks stay dark in light mode */
    --code-text: #c8d6e5;
    --dot: rgba(13, 122, 62, 0.07);
  }
}

Typography (locked)

  • One typeface for everything: Geist Mono 400/500/600/700 from Google Fonts (https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500;600;700&display=swap). Fallback stack 'SF Mono', Consolas, monospace. No second typeface, ever.
  • Titles are large weight-400 mono, never bold display. Display clamp(36px, 7vw, 88px) weight 400 letter-spacing -2px; headings clamp(24px, 4vw, 42px) weight 400 letter-spacing -1px.
  • Labels/eyebrows: 10-13px, weight 600, uppercase, letter-spacing 1.5-2px, accent color. Subtitles: uppercase mono in --text-dim.
  • Body and bullets: 15-20px, line-height ~1.6, --text-dim.
  • Numbers use font-variant-numeric: tabular-nums.

Signature devices (locked)

  • Dot grid on every slide: background-image: radial-gradient(var(--dot) 1px, transparent 1px); background-size: 24px 24px; This replaces the radial accent glows other family themes use — no glows here.
  • Hairlines, not shadows: 1px borders in --border / --border-bright. No box-shadows, no blurs (except the nav-dots backdrop blur from the seed).
  • Square geometry: border-radius 0-2px everywhere; bullet ticks are 7px squares in --accent (no round dots); deck dots are squares.
  • Corner bracket decor (title/closing slides only): two 1.5px accent lines at ~0.25 opacity forming an L in a corner, as inline SVG.
  • Section divider numbers: giant mono numerals (up to 260px), weight 400, accent color at 0.05 opacity, centered behind the heading.

Deck engine & navigation (keep verbatim from the seed)

  • .deck is a 100dvh scroll-snap container; each page is one <section class="slide"> (also 100dvh, scroll-snap-align: start).
  • SlideEngine (plain JS, no dependencies) builds the chrome: 2px accent progress bar, square dot rail (right, backdrop-blurred), n / N counter,

…

FAQ

What are 'design tokens'?

These are the basic visual building blocks, like colors and fonts, that define the theme's appearance.

Can I use other colors or fonts?

No, the theme is 'locked' to maintain visual consistency. You should only use the defined tokens.

How are presentations created?

You edit an HTML file, replacing the slide content but keeping the structure and styling defined by the plugin.

Details

Original description by the author

OpenDesign from the CLI: driving the full design workflow with the `od` command — scripted, composable, agent-ready. Built as a decision-grade AI literacy deck for developers, power users.

repo: nexu-io/open-design

Popularity

GitHub stars
101k
Ranking position
#587
License
Apache-2.0
Updated
10/16/2026

Is this skill useful?

0

Sign in to vote.

Comments

  • …

More skills from this repository

Similar skills