industrial-brutalist-ui

Generates CSS-based blueprints for high-density dashboards and landing pages with brutalist styling.

Updated Apr 17, 2026
One-click install
npx skills add https://github.com/djkloop/n --skill industrial-brutalist-ui-djkloop
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: industrial-brutalist-ui
Source: https://github.com/djkloop/n/tree/main/.trae/skills/industrial-brutalist-ui
Command: npx skills add https://github.com/djkloop/n --skill industrial-brutalist-ui-djkloop

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designing data-heavy dashboards and portfolios with an industrial-brutalist visual language that conveys precision, density, and mechanical clarity.

Core Features & Use Cases

  • Rigid modular grids and visible compartmentalization for clear information hierarchy.
  • Extreme typographic scale contrast and utilitarian color to emphasize data and telemetry.
  • Analog degradation effects (halftones, CRT-like scanlines) to evoke declassified blueprints for technical contexts.
  • Use Case: Create dashboards, portfolios, or editorial sites that require a technical, blueprint-like aesthetic.

Quick Start

Design a data-heavy dashboard mockup using the chosen brutalist scheme to demonstrate the visual system.

Frequently Asked Questions about industrial-brutalist-ui

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

FAQPage Schema
How do I design data-dense dashboards with an industrial-brutalist aesthetic?

Design data-dense dashboards by applying rigid modular CSS grids, extreme typographic scale contrast, and utilitarian color substrates to achieve mechanical clarity. This industrial-brutalist approach ensures precise information hierarchy for data-heavy interfaces.

What is industrial-brutalist UI design and when should I use it?

Industrial-brutalist UI is a design approach using rigid grids, macro typography, and analog degradation effects to convey density and mechanical clarity. Use it for portfolios, editorial sites, and technical dashboards requiring a blueprint-like aesthetic.

Can I create analog degradation effects like CRT scanlines using CSS and SVG?

Yes, you can create analog degradation effects like CRT scanlines and halftones using CSS and SVG. These degradation effects evoke declassified blueprints and technical contexts within industrial-brutalist data visualization layouts.

Does this brutalist UI approach work for data visualization and editorial sites?

Yes, this brutalist UI approach works effectively for data visualization and editorial sites. It uses visible compartmentalization and rigid grids to handle dense information while maintaining a technical, blueprint-like visual hierarchy.

What are the limitations of using brutalist UI for dashboards?

Limitations of brutalist dashboards include the rigid grids and extreme typographic scale contrast potentially reducing readability for non-technical users. This approach prioritizes mechanical clarity and data density over conventional, user-friendly interface aesthetics.