UI Foundations relies on tabler-icons for its iconography. This library is a set of over 5000 free MIT-licensed high-quality SVG icons for you to use in your web projects. Tabler Icons was chosen over other libraries due to its high quality, comprehensive set of icons, and its MIT license.

​
Usage

To use an icon, you can import it from the react-icons/tb package and use it in your components.

import { IconName } from 'react-icons/tb';

export default function MyComponent() {
  return (
    <IconName />
  );
}

​
Default icons in MUI components

Some built-in MUI components like the <Checkbox /> and <Radio /> are overridden to use Tabler Icons instead of Material icons. This is to ensure that the icons used in the components are consistent with the rest of the app, and helps contribute to a unique style.

You are still free to use the Material icons in your app, but the default icons used by UI Foundations Kit all come from the Tabler icons set.

TypographyBorder Radius