Feature Set

Overview

Feature sets are uset to represent a summarized version of application features.

They are to be used within installations and other similar pages where a quick glance of relevant characteristics is needed.

Implementation

  • Feature 1
  • Feature 2
  • Feature 3

Edit the code below to see your changes live!

function Example() {
  const tags = [
    { label: 'Feature 1', icon: <AutoAwesomeIcon /> },
    { label: 'Feature 2', icon: <AutoAwesomeIcon /> },
    { label: 'Feature 3' },
  ];

  return <FeatureSet tags={tags} />;
}

Props

Prop name
Type
Default
Description
iconIcon

Pass in an Icon component to display at the start of the tag.

label *string

Defines the FeatureTag text.

Props ending with * are required

Do's and Don'ts

Do
Use short feature descriptions.
Use relevant icons associated to the feature description.
Don't
Do not use feature tags to convey application status.
Do not use as a call to action element.