Design By Examples

Welcome to Design By Examples, a comprehensive documentation hub dedicated to modern design systems, UI patterns, and development workflows. This repository serves as a living guide for designers and developers looking to build consistent, accessible, and beautiful interfaces.

Click the green Use this template button at the top of this repo to copy the Mintlify starter kit. The starter kit contains examples with

This documentation covers a wide range of topics essential for digital product design:

• Foundations: Core principles including Color Systems, Spacing, and Typography.
• Typography: Deep dives into Type Scales, Line Height, and Hierarchy.
• Layout: Understanding Auto Layout, Grids, and Constraints.
• UI Components: Practical guides for building Cards, Nav Bars, Tables, and more.
• AI Tools: Leveraging modern tools like Cursor and Claude Code for design engineering.

🚀 Running Locally

This documentation is built with Mintlify. To run it locally:

npm i -g mint

Run the following command at the root of your documentation, where your docs.json is located:

mint dev

3. Preview: Open http://localhost:3000 in your browser.

🤝 Contributing

We welcome contributions! Whether it's fixing a typo, adding a new component example, or improving existing guides.

Please check out our Creating a Pull Request guide to get started.

Resources

• Mintlify documentation