COCSO UI provides 83 icons across two categories. It consists of 68 semantic icons based on Tabler Icons and 15 brand icons. All icons are distributed as React components from the @cocso-ui/react-icons package and rendered as inline SVG.

Import the desired icon by name from the package. Each icon is a named export ending with Icon.

import { SearchIcon } from "@cocso-ui/react-icons";

export default function Example() {
  return <SearchIcon size={20} />;
}

Icon components accept all standard SVG element attributes in addition to the following props.

Icons are automatically marked with aria-hidden="true" so they are hidden from assistive technologies by default. When an icon conveys meaning on its own, provide an accessible label at the point of use.

Use the search field to filter icons by name. Click an icon name to copy its import statement.