You are browsing the documentation for version 4.1 of OroCommerce, OroCRM and OroPlatform, which is no longer maintained. Read version 5.1 (the latest LTS version) of the Oro documentation to get up-to-date information.

See our Release Process documentation for more information on the currently supported and upcoming releases.


Atoms are the simplest elements that are building the interface. They include basic HTML elements such as buttons, inputs, headers, etc. which cannot be separated without losing functionality. Each atom has its own properties.

Consider a button atom whose properties are:

  • Background color

  • Form

  • Title color, size, font

Changing the properties of an atom, you change the general style of the interface where this atom is used.

Atoms demonstrate all your basic styles, which can be a useful reference material to be followed when developing a design and implementing it in OroCommerce.

Illustration of the atom properties