npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

design-skill-os

v1.0.0

Published

Turning Standard AI into an Elite Design Strategist via specialized Design Skill OS.

Readme

Design Skill OS Pro Max ⚡


🧠 The Cognitive "Brain": Derived from 10+ Design Books

Design Skill OS is not just a document; it's a professional-grade reasoning layer that transforms standard AI outputs into elite-level design masterworks. We have exhaustively synthesized principles from the "Design Bibles" to prime your AI agent with the strategic intent of a world-class Creative Director.

📚 The Source of Truth

The intelligence core is distilled from the collective wisdom of masters:

  • Milton Glaser (Art is Work): Rejecting "schtick" for authenticity.
  • Ellen Lupton (Thinking with Type): Mastering the grid and typographic hierarchy.
  • Michael Bierut (How to Use Graphic Design to...): Using design as a tool for clear communication.
  • Bruce Mau (MC24): Designing for massive change and performativity.
  • Donald Norman (The Design of Everyday Things): Cognitive psychology and affordances.
  • Debbie Millman (Brand Thinking): Mapping the emotional resonance of identity.
  • Charles & Ray Eames: The philosophy that "The details are not the details; they make the design."

🛠 What the "Brain" Injects into your AI:

  • [Section 2] Gestalt Sovereignty: Forces the AI to use proximity, similarity, and closure to organize information naturally.
  • [Section 5] Chromatic Mastery: Implements the 60-30-10 Rule and creates harmonious palettes based on industry psychology.
  • [Section 8] Typographic Modular Scale: Calculates line-height, leading, and pairing using the Golden Ratio.
  • [Section 15] Digital Heuristics: Applies the 10 core usability rules (Nielsen/Norman) to every interface layout.
  • [Section 23] Red Team Audits: Advanced adversarial self-critique based on WCAG 2.1 and Bruce Mau's performance metrics.

⚡ What's New: The Red Team Protocol

The AI no longer just "makes pixels"—it audits them. Every design of the Design Skill OS undergoes an automated "Red Team" gauntlet:

1. HEURISTICS    -> Fixes UX friction & logic errors.
2. ACCESSIBILITY -> Ensures WCAG AA compliance (Contrast/Targets).
3. ANTI-SCHTICK  -> Strips "lazy" AI trends for authentic branding.

🔥 Features that Ignite Creativity

  • 🧠 161+ Reasoning Rules: Specialized logic for everything from SaaS dashboards to Luxury E-commerce.
  • 🎨 Chromatic Mastery: Implements the 60-30-10 Rule and the Golden Ratio for typographic hierarchy.
  • 🛡️ Red Team Swarm: Built-in adversarial protocols that kill "lazy" design defaults before they reach you.
  • 📜 Narrative Synthesis: Forces AI to define a "Call to Adventure" and entry point for every page.
  • 🛠️ Multi-Assistant Native: Tailored templates for Claude Code, Cursor, Windsurf, Antigravity, and Move.

🚀 Installation & Setup

1. Global CLI Install

npm install -g design-skill-os

2. Prime Your Assistant

Initialize the skill for your specific AI stack. This injects the "Brain" directly into your project's configuration.

# General Setup
design-skill init --ai claude      # Claude Code / CLI
design-skill init --ai cursor      # Cursor IDE
design-skill init --ai windsurf    # Windsurf
design-skill init --ai antigravity # Antigravity (Elite)
design-skill init --ai all         # Global System Sync

3. Global Deployment (Recommended)

Available across all your projects without redundant initialization:

design-skill init --ai claude --global

📖 The "Master Designer" Workflow

Once installed, your AI agent gains instant access to the Design Skill OS core. Just chat naturally:

"Build a luxury watch landing page using the Design Skill OS rules. Ensure a Red Team check for color-blindness and narrative arc."

The Resulting Workflow:

  1. Discovery: AI maps brand personality using Section 17 rules.
  2. Strategy: Defines the layout using the Gestalt Principles (Section 2).
  3. Execution: Generates high-fidelity code with CSS variables and semantic HTML.
  4. Red Team: Runs the Adversarial Audit (Section 23) to fix contrast and trend-chasing.

📂 Architecture Overview

┌─────────────────────────────────────────────────────────────────┐
│  CORE SYSTEM: Design Skill OS                                   │
├─────────────────────────────────────────────────────────────────┤
│  src/design-skill/                                              │
│     ├── SKILL.md        <-- The "Brain" (Knowledge Base)        │
│     ├── data/           <-- 161+ Industry Reasoning Rules       │
│     ├── scripts/        <-- AI Search & Logic Engine            │
│     └── templates/      <-- High-Fidelity UI Patterns           │
├─────────────────────────────────────────────────────────────────┤
│  cli/                   <-- Dynamic Deployment Engine           │
└─────────────────────────────────────────────────────────────────┘

🏆 Supported Industry Rules

| Category | High-Fidelity Focus | | :--- | :--- | | SaaS & Tech | Efficiency, Clarity, Developer Tooling | | Fintech | Trust, Precision, Data Density | | Luxury & E-com | Emotion, Elegance, Storytelling | | Healthcare | Accessibility, Calm, Information Hierarchy | | Creative Arts | Portfolios, Branding, Experimental UI |


🤝 Contributing & Support

We build for the future of AI-human collaboration.

  • Stars are our fuel. If this helps you build better, drop a ⭐.
  • PRs are welcome. See CLAUDE.md for the contributor's style guide.

📄 License

This project is licensed under the MIT License. See the LICENSE file for the full text.