industrial-brutalist-ui

Generates brutalist web interfaces combining Swiss typography with military terminal aesthetics.

52|3|Updated Aug 20, 2026
One-click install
npx skills add https://github.com/Wayn-Git/Amethyst --skill industrial-brutalist-ui-wayn-git
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: industrial-brutalist-ui
Source: https://github.com/Wayn-Git/Amethyst/tree/main/agents/skills/industrial-brutalist-ui
Command: npx skills add https://github.com/Wayn-Git/Amethyst --skill industrial-brutalist-ui-wayn-git

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Designing data-heavy dashboards, portfolios, or editorial sites with a distinctive industrial aesthetic requires deep knowledge of typographic systems, grid engineering, and analog degradation effects that most developers lack. ## Core Features & Use Cases - Dual Visual Archetypes: Implements either Swiss Industrial Print (light, blueprint-style) or Tactical Telemetry (dark, CRT terminal) design systems with strict consistency rules. - Typographic Architecture: Defines macro-typography with fluid clamp() scaling, negative tracking, and micro-typography using monospace fonts for data readouts. - Analog Degradation Effects: Applies halftone dithering, CRT scanlines via repeating-linear-gradient, and SVG noise filters to simulate physical media. - Use Case: Build a declassified-blueprint-style portfolio site with viewport-bleeding black sans-serif headers, 1px grid compartmentalization, hazard-red accents, and ASCII-framed metadata labels. ## Quick Start Use the industrial-brutalist-ui skill to design a dark tactical telemetry dashboard for my server monitoring page with monospace data tables and scanline effects.

Frequently Asked Questions about industrial-brutalist-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a brutalist website design with CSS?▼

Brutalist CSS design uses strict display:grid layouts with 1px gaps for dividing lines, zero border-radius, and extreme typographic contrast. Combine massive clamp()-scaled sans-serif headers with small uppercase monospace metadata text.

What fonts work best for industrial terminal UI design?▼

Use heavy neo-grotesque fonts like Inter Black or Archivo Black for structural headers, and monospace fonts like JetBrains Mono or IBM Plex Mono for data and telemetry. High-contrast serifs like Playfair Display work sparingly with halftone post-processing.

How to add CRT scanline effects to a webpage?▼

Apply a repeating-linear-gradient background with alternating transparent and semi-transparent black 2px bands to simulate electron beam sweeps. Combine with a low-opacity SVG noise filter on the DOM root for unified physical grain.

Can I mix light and dark modes in brutalist design?▼

No, this design system requires choosing one substrate palette per project. Swiss Industrial Print uses off-white paper backgrounds with carbon ink, while Tactical Telemetry uses near-black backgrounds with white phosphor text.

When should I not use brutalist UI design?▼

Avoid brutalist aesthetics for consumer products requiring conventional usability patterns, soft visual hierarchies, or approachable branding. The style suits data-dense dashboards, portfolios, and editorial sites where raw functionality is the desired message.