hue  by dominikmartn

Brand-aware AI design system generator

Created 2 weeks ago

New!

498 stars

Top 62.2% on SourcePulse

GitHubView on GitHub
Project Summary

Summary

Hue is an open-source skill designed to automate the creation of comprehensive design systems from any brand. It addresses the challenge of maintaining visual consistency in AI-generated UIs by learning brand identities from URLs, names, or screenshots. This empowers AI coding assistants to produce components that precisely match a user's brand, streamlining development and ensuring cohesive aesthetics.

How It Works

The skill analyzes input brand information (URL, name, screenshot) to extract key design elements. It then generates a complete design language, encompassing color tokens, typography scales, spacing rules, component styles, and support for light/dark modes. This approach ensures that AI-generated code, when using the Hue skill, produces visually consistent outputs across different sessions, effectively translating brand identity into functional design assets.

Quick Start & Requirements

  • Installation: Clone the repository into the appropriate directory for your AI assistant:
    • Claude Code: git clone https://github.com/dominikmartn/hue ~/.claude/skills/hue
    • Codex: git clone https://github.com/dominikmartn/hue ~/.agents/skills/hue (or use the alternative CLI-compatible path).
  • Prerequisites: Requires integration with AI coding assistants like Claude Code or Codex. No other specific software or hardware dependencies are listed.
  • Demo: See it in action at hueapp.io. Example rendered design systems are available in the examples/ directory of the repository.

Highlighted Details

  • Generates a full design language: color tokens, typography, spacing, components, light/dark modes, hero stage recipes, and icon kit selection.
  • Ensures visual consistency across AI-generated components from different sessions.
  • Features 17 example brands, including a real-world example (mymind-design), showcasing diverse outputs with design-model.yaml and HTML landing pages.
  • Some examples include app-screen.html or full component-library.html demonstrations.

Maintenance & Community

No specific details regarding maintainers, community channels (e.g., Discord, Slack), or roadmap are provided in the README. The project is hosted under the dominikmartn GitHub organization.

Licensing & Compatibility

The project is released under the MIT License. This permissive license allows for broad use, modification, and distribution, including integration into commercial and closed-source projects without significant restrictions.

Limitations & Caveats

The README does not explicitly detail limitations, known bugs, or alpha status. Its functionality is tied to specific AI coding assistants (Claude Code, Codex), implying it is not a standalone tool but rather a skill or plugin for these platforms. The "opinionated" nature suggests potential constraints on customization beyond the learned brand identity.

Health Check
Last Commit

1 week ago

Responsiveness

Inactive

Pull Requests (30d)
0
Issues (30d)
2
Star History
504 stars in the last 16 days

Explore Similar Projects

Feedback? Help us improve.