khalidabdi1/design-ai

Design AI Systems is a collection of DESIGN.md files that describe the visual style of well known websites and brands so that AI coding tools can build user interfaces that look like them. The idea is simple: instead of telling an AI agent to make something that feels like Stripe or Airbnb in vague words, you drop in a markdown file that spells out the colors, fonts, spacing, and component patterns of that brand, and the agent has a real reference to work from. A DESIGN.md is a plain text design system document. The README explains that it sits next to AGENTS.md, which tells the agent how to work in a repo, while DESIGN.md tells the agent how the interface should look and feel. The format is human readable, version controlled with Git, easy to edit by hand, and meant to be portable across projects. Every file in the library follows a fixed nine section structure. The sections cover visual theme and atmosphere, color palette and roles, typography rules, component stylings, layout principles, depth and elevation, do's and don'ts, responsive behavior, and a final agent prompt guide with ready to use snippets. The repository ships with around 150 of these files, grouped by category such as social, creative platforms, commerce, media and gaming, and developer tools. Featured examples include Stripe, Figma, Apple, Slack, Netflix, Airbnb, Coinbase, PayPal, Asana, and Zoom. To use one, you pick a company folder, copy its DESIGN.md into your own project root, and tell your AI agent to treat that file as the design source of truth.