industrial-brutalist-ui

Design web interfaces with industrial Swiss typographic aesthetics using CSS Grid.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/Ashtoon95-R/paviments-catalunya --skill industrial-brutalist-ui-ashtoon95-r
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: industrial-brutalist-ui
Source: https://github.com/Ashtoon95-R/paviments-catalunya/tree/main/.agents/skills/industrial-brutalist-ui
Command: npx skills add https://github.com/Ashtoon95-R/paviments-catalunya --skill industrial-brutalist-ui-ashtoon95-r

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the need for web interfaces that embody an industrial, mechanical design philosophy, blending Swiss typographic design with military terminal aesthetics for data-heavy dashboards and editorial sites.

Core Features & Use Cases

  • Swiss Industrial Print Design: Incorporates high-contrast light modes, monolithic sans-serif typography, and unbleached documentation paper backgrounds.
  • Tactical Telemetry & CRT Terminal: Features dark mode, high-density tabular data presentation, and monospaced typography with ASCII framing.
  • Typographic Architecture: Offers extreme variance in scale, weight, and spacing with specific web fonts for headers and data.
  • Color System: Utilizes uncompromising color palettes that simulate physical media or primitive emissive displays.
  • Layout and Spatial Engineering: Adheres to strict CSS Grid architectures and rejects conventional web padding in favor of visible compartmentalization.
  • UI Components and Symbology: Replaces standard web UI conventions with utilitarian, industrial graphic elements.
  • Textural and Post-Processing Effects: Implements simulated analog degradation via CSS and SVG filters.

Quick Start

To initiate the creation of an industrial-brutalist UI, execute the 'industrial-brutalist-ui' skill and provide the necessary project parameters.

Frequently Asked Questions about industrial-brutalist-ui

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

FAQPage Schema
How do I apply industrial aesthetics and Swiss typography to web interfaces?

Industrial aesthetics and Swiss typography are applied to web interfaces by combining rigid CSS Grid architectures, high-contrast typographic scale variance, and utilitarian color palettes to design data-heavy dashboards and editorial sites.

What is the best way to design data-heavy dashboards with tactical telemetry and CRT terminal styles?

Data-heavy dashboards with tactical telemetry and CRT terminal styles are designed using dark mode layouts, high-density tabular data presentation, and monospaced typography with ASCII framing to simulate primitive emissive displays.

Do I need to know CSS Grid and web typography to use industrial design principles for web design?

You need knowledge of CSS Grid, web typography, and web design principles to effectively implement industrial design principles, as the process requires strict grid architectures and extreme typographic scale contrast.

How do I add analog degradation effects and visible compartmentalization to an editorial site layout?

Analog degradation effects and visible compartmentalization are added to editorial site layouts by replacing conventional web padding with strict CSS Grid compartments and applying simulated analog degradation via CSS and SVG filters.

Can I use monospaced typography and ASCII framing for portfolio web design?

Monospaced typography and ASCII framing can be used for portfolio web design by applying the tactical telemetry and CRT terminal aesthetic, which features high-density tabular data presentation and uncompromising utilitarian color palettes.

When should I not use industrial brutalist UI for data visualization?

You should not use industrial brutalist UI for data visualization when standard web UI conventions and conventional padding are required, as this approach rejects those norms in favor of utilitarian industrial graphic elements and visible compartmentalization.