stacks-design-taste

Enforce Stacks UI, Crosswind, and CSS design standards for interfaces.

2|Updated Jul 8, 2026
One-click install
npx skills add https://github.com/bughq/bughq --skill stacks-design-taste-bughq
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: stacks-design-taste
Source: https://github.com/bughq/bughq/tree/main/.claude/skills/stacks-design-taste
Command: npx skills add https://github.com/bughq/bughq --skill stacks-design-taste-bughq

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill prevents the generation of generic, templated, or low-quality frontend code by enforcing strict design discipline and aesthetic alignment with the Stacks ecosystem.

Core Features & Use Cases

  • Design Inference: Analyzes project briefs to determine the appropriate aesthetic, motion, and density settings before writing code.
  • Stacks-Native Implementation: Ensures all interfaces are built using official Stacks UI components, Crosswind utilities, and Iconify, avoiding external library bloat.
  • Pre-Flight Discipline: Enforces strict rules on typography, color consistency, and layout to ensure high-fidelity, professional-grade output.

Quick Start

Use the stacks-design-taste skill to design a premium landing page for a B2B SaaS product with a minimalist aesthetic.

Frequently Asked Questions about stacks-design-taste

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

FAQPage Schema
How do I prevent generic, templated frontend code when building Stacks landing pages?

To prevent generic frontend code in Stacks, apply strict design discipline using anti-slop aesthetic dials and component standards. This enforces high-fidelity, non-templated interfaces by aligning typography, color, and motion with Stacks UI native patterns.

Do I need to use Crosswind utility classes for Stacks UI design implementation?

Yes, Stacks UI design implementation requires Crosswind utility classes. Using Crosswind alongside native CSS patterns ensures design consistency and performance while avoiding external library bloat in your frontend components.

What is the best way to configure aesthetic settings before writing Stacks frontend code?

The best way to configure aesthetics before writing Stacks frontend code is through design inference. This analyzes your project brief to determine appropriate aesthetic, motion, and density settings, ensuring premium component output.

Can I use external UI libraries alongside Stacks UI components for marketing pages?

You should not use external UI libraries alongside Stacks UI components for marketing pages. Stacks-native implementation enforces exclusive use of official components, Crosswind utilities, and Iconify to prevent library bloat and maintain design consistency.

How does pre-flight discipline improve Stacks frontend design quality?

Pre-flight discipline improves Stacks frontend design quality by enforcing strict rules on typography, color consistency, and layout. This ensures high-fidelity, professional-grade output for landing pages, portfolios, and marketing sections.

Does Stacks design implementation support minimalist B2B SaaS product interfaces?

Yes, Stacks design implementation supports minimalist B2B SaaS product interfaces. It applies specific aesthetic dials and component usage guidelines to build premium, high-quality landing pages tailored to your desired visual style.