Category Group Icon

Utility component for rendering category group icons.

AccessibilityPermalink to: Accessibility

Category Group Icon has role="presentation" to explicitly mark it as purely decorative, preventing assistive technologies from misinterpreting it as conveying meaningful information.

ExamplesPermalink to: Examples

Category Group IconPermalink to: Category Group Icon

Use the name prop to render a category group icon (see list of category group icons).

import { CategoryGroupIcon } from "@peakon/bedrock/react/assets/CategoryGroupIcon";

function Snippet() {
  return <CategoryGroupIcon name="engagement" />;
}

FormatsPermalink to: Formats

Category Group Icons can be rendered in SVG (default) or PNG format via the format prop.

import { CategoryGroupIcon } from "@peakon/bedrock/react/assets/CategoryGroupIcon";

function Snippet() {
  return (
    <>
      <CategoryGroupIcon name="engagement" format="svg" />
      <CategoryGroupIcon name="engagement" format="png" />
    </>
  );
}

Width and heightPermalink to: Width and height

Use the native HTML Image width and height attributes to set the size of the Category Group Icon.

import { CategoryGroupIcon } from "@peakon/bedrock/react/assets/CategoryGroupIcon";

function Snippet() {
  return <CategoryGroupIcon name="engagement" width="64" />;
}

Props TablePermalink to: Props Table

CategoryGroupIconPermalink to: CategoryGroupIcon

Props extend from HTML Image Element(external link), with the omission of role and style

RelatedPermalink to: Related

• List of category group icons
• System Icon component
• Graphic Icon component
• Category Group Icon component