**Kraken**
FreeCrypto trading platform. Purple-accented dark UI, data-dense dashboards
FreeFree tier
About **Kraken**
Kraken DESIGN.md is a structured markdown file that documents the design patterns of the Kraken crypto trading website, including colors, typography, spacing, elevation, and responsive behavior. It provides an independent analysis of publicly observable patterns, curated as a starting point for inspiration. The design is characterized by a purple-accented dark UI and data-dense dashboards. It is part of the awesome-design-md collection and can be added to a project via the npx getdesign@latest add kraken command. This file is intended for use with AI coding agents to help them understand and replicate the Kraken design system.
Key Features
Purple-accented dark UI patterns
Data-dense dashboard layouts
Documents colors, typography, spacing, elevation, and responsive behavior
Install via npx getdesign@latest add kraken
Independent analysis of publicly observable patterns
Designed to work with AI coding agents for UI development
Pros & Cons
Pros
- Provides a structured, documented design system for Kraken's UI patterns
- Free and open source
- Easy to install and integrate with AI coding agents via npx
- Independent analysis – not biased by the company
- Covers key design aspects like colors, typography, spacing, elevation, and responsiveness
Cons
- Not an official design system from Kraken – based on independent observation
- May not include all components or internal design guidelines
- Designed as a starting point, not a pixel-perfect reproduction
- Only analyzes publicly visible patterns; internal design tokens or brand assets may be missing
Best For
Building crypto trading platform UIsCreating data-dense dashboards with dark themesReference material for AI agents to generate consistent UI codeInspiration for purple-accented dark design systemsEducational study of real-world design patterns
FAQ
What is a DESIGN.md file?
DESIGN.md is a concept introduced by Google Stitch – a structured markdown file that documents design patterns such as colors, typography, spacing, elevation, and responsive behavior, all observed on a public website.
How do I use the Kraken DESIGN.md file?
Run the command 'npx getdesign@latest add kraken' from your project root, then ask your AI assistant to use DESIGN.md for UI work.
Is this DESIGN.md officially endorsed by Kraken?
No, this is an independent analysis of publicly observable patterns. It is not affiliated with or endorsed by Kraken. Kraken and its logo are trademarks of their respective owner.
What design patterns are documented?
The file covers colors (including the purple accent), typography, spacing, elevation, and responsive behavior as observed on the Kraken website.
Is the Kraken DESIGN.md free?
Yes, the DESIGN.md file is free to use and part of an open-source collection.