Rules and Principles

The rules and principles we use in the design and development of the system

Follow the Guidelines

Always refer to the design system's documentation.
It contains rules and examples to ensure consistency in look and feel across different parts of the product.

Don't Reinvent the Wheel

If a component (like a button or a card) already exists in the system, use it!
Don’t create a new version unless absolutely necessary.

Communicate Changes

If you need to modify a component, talk to the design system team. They might need to update the system for everyone, rather than letting changes happen in isolation.

Test Before Extending

If you must extend or customize something, make sure it works with the rest of the system and doesn’t break the design or user experience.

Keep It Simple

Stick to the simplest and most obvious (implied) solution. Avoid overcomplicating layouts or designs unnecessarily.

Be Consistent

Use the same styles, colors, buttons, and fonts as specified in the design system.
This ensures that everything looks and works the same across all pages or products.

Respect the System's Flexibility

Design system often have flexible options for different use cases.
Stick to these predefined options rather than customizing things too much, which could cause inconsistencies.

Use Components as Intended

Each component in the design system is built for a specific purpose.
For example, don't use a button as a link. Use each component according to its original role.

Prioritize Accessibility

Ensure that the components you're reusing are accessible to all users (e.g., screen reader users). The design system already accounts for accessibility, so use those best practices.

Contribute Back

If you create something new or enhance a component, share it with the design system team so it can possibly become part of the system and benefit others.