Can I switch between light and dark modes easily?

The skill provides two distinct modes (Swiss Industrial Print and Tactical Telemetry), but it recommends committing to one per project to maintain aesthetic integrity.

What is Industrial Brutalism in web design?

It is a design philosophy that prioritizes raw functionality, rigid grids, and bold typography, often drawing inspiration from industrial manuals and legacy terminal interfaces.

What typography does this skill use?

It utilizes a combination of Neo-Grotesque sans-serifs for macro-headings and technical monospaced fonts for micro-data and telemetry.

Does this skill support standard UI frameworks?

Yes, it provides directives for modern CSS and HTML semantics, making it compatible with frameworks like React, Vue, or plain HTML/CSS while enforcing its specific aesthetic.

Industrial Brutalist UI

Name: Industrial Brutalist UI
Author: cskwork

bycskwork

0•

Design Tools

Architects raw, high-impact web interfaces that synthesize Swiss typographic design with retro-military terminal aesthetics.

The Industrial Brutalist UI skill empowers Claude to design and implement sophisticated digital environments characterized by mechanical precision and raw functionality. By blending mid-century Swiss modernism with tactical telemetry patterns, it enables the creation of data-heavy dashboards, technical portfolios, and editorial sites that reject soft consumer UI trends. The skill enforces strict rules for rigid modular grids, extreme typographic contrast, and programmatic analog degradation effects like CRT scanlines and halftone dithering, ensuring a consistent and uncompromising visual identity.

Key Features

01Industrial iconography system utilizing ASCII framing and technical symbology

02Extreme typographic scaling using fluid CSS clamping and bimodal font pairing

03Strict CSS Grid-based layouts with visible structural compartmentalization

04Dual-mode substrate control: Swiss Industrial Light or Tactical Telemetry Dark

050 GitHub stars

06Simulated analog degradation via SVG filters and CSS post-processing

Use Cases

01Creating technical documentation sites that mimic industrial blueprints and manuals

02Building high-density data dashboards for monitoring or cybersecurity systems

03Designing avant-garde portfolios with aggressive typographic architectural patterns

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cskwork/claude-minimal-plugin brutalist-skill

For use in Claude.ai and ChatGPT

Key Features

01Industrial iconography system utilizing ASCII framing and technical symbology

02Extreme typographic scaling using fluid CSS clamping and bimodal font pairing

03Strict CSS Grid-based layouts with visible structural compartmentalization

04Dual-mode substrate control: Swiss Industrial Light or Tactical Telemetry Dark

050 GitHub stars

06Simulated analog degradation via SVG filters and CSS post-processing

Use Cases

01Creating technical documentation sites that mimic industrial blueprints and manuals

02Building high-density data dashboards for monitoring or cybersecurity systems

03Designing avant-garde portfolios with aggressive typographic architectural patterns

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cskwork/claude-minimal-plugin brutalist-skill

For use in Claude.ai and ChatGPT