We are thrilled to share dYdX's open source design system! At dYdX, we are committed to decentralization across the stack, in addition to the release of dYdX Chain, we are also opening up our design system to the world.
Empowering the Community
Our design system provides a behind-the-curtains look at our brand and product design language. It includes a comprehensive set of assets and references that enable anyone to contribute. Whether you are a designer, developer or enthusiast, you can now access and utilize dYdX's assets, logos, patterns, graphics, and more.
Crafted with Passion
dYdX's interface has been a labor of love, undergoing several major iterations over the years. We have designed complex desktop and mobile products that feature beautiful abstractions and powerful components. These products form the foundation of the experience that traders have come to love.
Typography & Colors
Our carefully crafted typography and high contrast color system define the visual tone of dYdX. Dive into the details of our design choices to see what makes dYdX designs visually distinct. These elements have been chosen with great care to embody the design principles that guide our brand.
Cross-Platform Components
With our open source design system, you can start using system elements from our UI library. Design your own cross-platform products with ease. Whether it's buttons, loaders, charts or menus, our UI library provides the building blocks you need.
Our Process
At dYdX, our design process is collaborative and iterative. We verify and define problems closely with our Product team to ensure we meet the needs of traders. Our design, prototyping, and annotations happen in Figma, with ongoing feedback loops through Slack channels and user interviews.
Given we are a small team that strives to move quickly, we are careful not to over-invest time during the design phase, and expect that the final engineering implementation of the designs is the ultimate expression. As such, we work closely with engineers to address polish & edge cases as they arise.
The final design is handed off through synchronous design reviews, and specific Slack channels containing folks across leadership, product, engineering and design, after which a design will move into the implementation phase.
Depending on the complexity of the feature, it may go through testing, staging builds and feature flags. We continuously gather user feedback through regular interviews & various channels on Discord, allowing us to refine and improve the final product.
Understanding Risk
While we believe that open-sourcing our design system will foster a more robust dYdX community, we encourage traders to be wary of potential scams. Malicious actors may use this system to create attack vectors that look legitimate. We encourage traders to always DYOR before connecting your wallet to any interface—especially ones claiming to be dYdX.
Currently, the only interface to trade on v3 is trade.dydx.exchange.
dYdX Chain software may be deployed by any third-party, subject to the v4 Terms of Use. We’ve put together a resource of dYdX Chain interfaces that you can use as a starting place for your trading. Note that all of the third parties listed are independent from and unaffiliated with dYdX.
Start Designing
We invite you to explore our design system on Figma and become a part of our journey. Visit this link to access our design system and feel free to provide us with any feedback, questions, or requests. The designs are subject to the v4 Terms of Use and GNU Affero General Public License.
Your feedback, questions, and suggestions are highly valued as we continue to evolve our design system. Join us in shaping the future of dYdX's design language and contribute to the growing community of designers and builders.
.avif)