Icons

All of the icons used in design system components are exposed as CSS classes. They may be used in conjunction with an <i> element, or they can be used as the icon prop for components that support it.

To achieve a 24px (1.5rem) icon size, add the text-icon utility class.

<i class="mds-warning-circle text-icon text-red-600"></i>
<mx-icon-button icon="mds-x" el-aria-label="Close" />
<i class="mds-clock text-icon text-blue-500"></i>