Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
nexu-io avatar

Html Ppt Taste Brutalist

nexu-io/open-design

  • 165 installs
  • 83.7k repo stars
  • Updated August 5, 2026
  • nexu-io/open-design

Produce brutalist HTML presentations for edgy brand pitches, developer tool demos, and anti-polish storytelling decks.

About

Open-design skill for brutalist-taste HTML slide decks featuring stark layouts, heavy fonts, and minimal ornamentation for developer-facing and counter-culture product presentations in nexu-io/open-design.

  • Brutalist slide theme
  • Bold typographic hierarchy
  • HTML presentation output
  • Edgy brand storytelling
  • Open-design repo

Html Ppt Taste Brutalist by the numbers

  • 165 all-time installs (skills.sh)
  • +1 installs in the week ending Aug 4, 2026 (Skillselion tracking)
  • Ranked #988 of 1,880 Design & UI/UX skills by installs in the Skillselion catalog
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
npx skills add https://github.com/nexu-io/open-design --skill html-ppt-taste-brutalist

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs165
repo stars★ 83.7k
Last updatedAugust 5, 2026
Repositorynexu-io/open-design ↗

What it does

Produce brutalist HTML presentations for edgy brand pitches, developer tool demos, and anti-polish storytelling decks.

Files

SKILL.mdMarkdownGitHub ↗

HTML PPT — Tactical Telemetry / CRT Terminal

A 16:9 deck for project debriefs, security reviews, infra incident write-ups, ops walkthroughs, and any "we are not selling, we are reporting" presentation. Reads like a declassified mission packet, not a pitch deck.

This skill commits to ONE substrate (dark CRT) — never mix with the light Swiss-print mode in the same artifact.

Source

Distilled from Leonxlnx/taste-skill — skills/brutalist-skill/SKILL.md §2.2 (Tactical Telemetry & CRT Terminal). Deck system follows the project's existing html-ppt convention (16:9 slides, vertical-stack fallback when opened directly).

Hard rules

  • Substrate: deactivated-CRT charcoal #0A0A0A / #121212. Never pure black.
  • Foreground: white phosphor #EAEAEA. Secondary #9A9A98.
  • Accent: ONE color — hazard red #E61919. Used on alerts, classifications, the latest data point. Never as a slide background fill.
  • Optional: terminal green #4AF626 for ONE specific UI element across the entire deck (e.g. a single status indicator). Omit if it doesn't earn its place.
  • Type: monospace dominates. JetBrains Mono / IBM Plex Mono for body and meta. Heavy condensed grotesque (Archivo Black / Inter Black) only for slide titles.
  • Title scale: clamp(56px, 7vw, 96px), uppercase, tracking -0.04em, leading 0.9.
  • Geometry: border-radius: 0. Visible 1px hairlines (#2A2A28 on charcoal). Use display: grid; gap: 1px over a hairline-colored background to render perfect cells.
  • Scanline overlay: subtle repeating-linear-gradient at 2px / 4px cycle, opacity ≤ 0.08, applied as a fixed pointer-events-none layer.
  • Phosphor noise: optional SVG-grain pseudo-element, opacity ≤ 0.06.
  • Slide chrome: every slide carries top register strip — classification, slide ID, timestamp, coordinates — and a bottom bar with serial number + page.

Banned

  • border-radius above 0.
  • Drop shadows, gradients, glassmorphism, glow.
  • Color other than charcoal, phosphor, hazard red, and at most one terminal-green element.
  • Sans-serif body fonts. Monospace is the body.
  • Pitch-deck "delight" — emoji, illustration, stock photography, friendly icons.
  • Light-mode slides anywhere in the same deck.
  • Slide transitions other than instant cuts.

Required slide archetypes (10–14 total)

1. Classification cover — giant numeral or call-sign on the left, redaction bar above the title, mono meta column on the right. 2. Briefing strip — eight-cell mono register with mission ID, dates, principals, classification. 3. Numbered objectives — three to five hairline-separated theses, each with >>> marker. 4. Telemetry grid — display: grid; gap: 1px of mono key-value cells; red highlight on the variant that breaks the trend. 5. Threat / risk register — hairline table with severity column in red. 6. Sequence / timeline — vertical mono list, 2-px vertical rule on the left, hazard markers on critical events. 7. Diagram / wiring — pure-CSS box-and-line schematic; rectangles with hairlines, ASCII arrows. 8. Specimen — single mono character or word at viewport-bleeding scale, used as a visual fulcrum. 9. Alert — diagonal hazard-stripe block (repeating-linear-gradient(135deg, ...)) with the most important sentence in the deck. 10. Audit log — append-only mono entries with timestamp + actor + event. 11. Closing colophon — operator, system, build, classification, sign-off line.

Motion

This aesthetic is mechanical and instant.

  • Cuts between slides — no fades. Optionally a 60ms flicker (opacity: 0.85 → 1).
  • A blinking caret on the cover (▌) and a single pulse on the live status dot. Nothing else moves.

Pre-flight

  • [ ] Substrate is charcoal, foreground is phosphor, only accent is hazard red
  • [ ] All border-radius is 0; all corners are 90°
  • [ ] Title slide includes classification + serial + timestamp + coordinates
  • [ ] At least one display: grid; gap: 1px telemetry module
  • [ ] Scanline overlay applied as fixed pointer-events-none element, opacity ≤ 0.08
  • [ ] At least one diagonal hazard-stripe alert block
  • [ ] ASCII syntax decoration ([ ... ], >>>, ///) appears at least four times across the deck
  • [ ] Numeric data uses tabular-nums + monospace
  • [ ] No emojis, no curves, no gradients, no shadow effects
  • [ ] Terminal green appears on zero or one element only — never as text body color

Related skills

anthropicsFrontend DesignGenerate distinctive, production-grade frontend interfaces and components that avoid generic AI aesthetics.716k165kvercel-labsWeb Design GuidelinesAutomatically audit frontend code against the latest Vercel Web Interface Guidelines for consistency, accessibility, and UX quality.498k29.6klarksuiteLark WhiteboardGenerate valid Lark Whiteboard (Feishu Board) documents with correctly placed connectors, automatic routing, and proper schema compliance directly from agent inst389k16ksleekdotdesignSleek Design Mobile AppsGenerate mobile app screens and UI from plain English descriptions using the Sleek.design API.315k476leonxlnxDesign Taste FrontendOverride generic LLM frontend output with intentional, metric-driven UI/UX taste.301k69.4knextlevelbuilderUi Ux Pro MaxGet instant, high-quality UI/UX decisions, component recommendations, style guidance, and code improvements across web and mobile projects.290k112k
Design & UI/UXuibranding
Browse by category
AI & AgentsFrontend & DesignBackend & DataDev ToolsAutomationTesting & ReviewSecurityMonitoring & CloudDocs & Planning
Design & frontend
Design systemsAnimation & motionAccessibility (a11y)CSS & TailwindUI designUXDesign to codeshadcn/uiLanding pagesBest design skills
Most searched skills
find-skillscavemanfrontend-designbrainstormingsystematic-debuggingstop-slopemil-design-engui-ux-pro-maxkarpathy-guidelinesweb-design-guidelinesreact-best-practicesgrill-meimprovemicrosoft-foundryagent-browser
Browse all listings
All agent skillsAll MCP serversAll marketplacesAll plugins

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.