Skip to content

Atoms

Atoms components have the following characteristics:

  • They are the fundamental components, so they are never using other components
  • They are components that are founded on a single HTML tag or element.
  • In really few exceptions they might be conformed by a tag and a child if a wrapper is necessary for browser rendered tags (self-closing ones like <img />) to adjust the style. This only happens for the @zurich/css-components versions.
  • They are available as part CSS components and WebComponents, but some of them only as part of the second one (as Number or Currency) since they require some JavaScript in order to work. They are always part of the @zurich/react-native library.
  • They can emit events.
  • Some of them can have slotted content.

Examples of these are:

html
<i z-icon="close"></i>
html
<a z-link="default" href="#">Link</a>
Link

List of atoms

...