epoko77-ai/design-diversity

Design Diversity is a Claude Code add-on that fixes a recurring complaint about generative AI. When you ask an AI to make a slide deck or a landing page, the results tend to look the same: the same gradient, the same rounded card, the same drop shadow. The author argues this is not really a model limit. It happens because nobody tells the model which design to aim for, so it falls back to a safe average. This project gives the model that missing direction. The core piece is a skill called design-pick, kept in skills/design-pick of the repo. Once you copy that folder into your Claude Code skills directory, you can either describe a feeling, like asking for a luxurious dark tone presentation, and the skill recommends two or three matching packs, or you can name a pack slug directly, like web-velvet-dark-boutique, and Claude builds the deck or site in exactly that style. Behind the skill sits a library of 100 packs, split roughly in half between presentation styles and website styles, with 20 of them flagged as premium packs that include five to seven worked out detail pages. Each pack is a folder with a prompt file, a tokens JSON for colors and type, a preview image, and a meta YAML. The pack spec covers color, typography, layout, spacing, charts, diagrams, and a do-not list, so Claude reproduces the look rather than improvising. All of this lives inside the skill under a references folder, so once installed it runs offline. The repo also ships a Next.js 15 catalog site so you can browse the packs visually before picking one, and a separate .claude folder that documents how the catalog itself was built using seven agents and eight skills. The text specs, tokens, and skill code are MIT licensed. The packs describe visual principles learned from public design systems, and the author is explicit that no specific brand logos or proprietary assets are redistributed, with each pack listing its learning source in its meta file.