design-principles

Define a design system with color, typography, spacing, and layout.

Updated Jan 22, 2026
One-click install
npx skills add https://github.com/SammyReifel/bioproject --skill design-principles-sammyreifel
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-principles
Source: https://github.com/SammyReifel/bioproject/tree/main
Command: npx skills add https://github.com/SammyReifel/bioproject --skill design-principles-sammyreifel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The design-principles skill provides a precise, minimal design system guide to ensure enterprise software, dashboards, and admin interfaces achieve clean, polished aesthetics with high consistency.

Core Features & Use Cases

  • Establish a single design direction (precision, warmth, sophistication, boldness, or utility) to align product teams.
  • Define a color foundation, typography, spacing, borders, depth, and surface treatment to create cohesive interfaces.
  • Use for dashboards, admin panels, or any UI requiring high-fidelity, craft-level polish.

Quick Start

Draft a design direction for a dashboard, then specify color foundation, typography scale, and spacing rules to implement.

Frequently Asked Questions about design-principles

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

FAQPage Schema
How do I create a consistent UI design system for an enterprise dashboard?

A UI design system for dashboards solves inconsistent interfaces by enforcing a precise, minimal system. It defines a single design direction, color foundation, typography scale, spacing grid, and depth strategy to guide implementation and ensure clarity.

What design principles help align product teams on admin panel aesthetics?

Design principles align product teams by establishing a single design direction—precision, warmth, sophistication, boldness, or utility. This direction governs color foundations, typography, spacing, borders, and surface treatment for cohesive admin panel aesthetics.

Can I use a minimal design system for high-density web apps?

Yes, a minimal design system suits high-density web apps. It covers color foundations, typography scales, and spacing grids specifically applied to enterprise products requiring clarity, density, and trust in their user interfaces.

What is the best way to define spacing and typography rules for web apps?

The best way to define spacing and typography rules for web apps is to establish a spacing grid and typography scale within a comprehensive design system. This ensures high-fidelity, craft-level polish and consistent interface implementation across products.

Do I need a color foundation strategy for enterprise software interfaces?

Yes, a color foundation strategy is needed for enterprise software interfaces to achieve clean, polished aesthetics with high consistency. It defines the core color system to guide implementation and ensure cohesive surface treatments across the product.