Color atom

This atom refers to the concept of color as a property that can be used to describe the appearance of different elements in an app. Instead of thinking of color as an object, it should be thought of as a property that can be applied to various components of the interface.

To understand how the color is applied and on which components, refer to the Foundation Color section of the design system.


Color is not a JSON object, it’s just a property. It can be an hexa string or the string “transparent”.
Here’s a list of example of possible values :


Color is an important aspect of design because it can greatly impact the overall aesthetic and user experience of a product. Color can be used to create visual interest, convey emotions, and guide the user's attention. It can also be used to create a sense of hierarchy, making certain elements stand out or recede into the background.

In addition to its aesthetic value, color also has a functional role in design. For example, color can be used to indicate important information or actions, such as error messages or call-to-action buttons. Color can also be used to create contrast, making text more legible and easier to read.

In GoodBarber apps, color is often organized into a palette, which is a set of predefined colors that can be used consistently across the entire app. This helps to ensure visual consistency and makes it easier to maintain a cohesive design.