icon/introduction

Quick Demo

This component uses @iconify/react under the hood, so any prop from that is supported. It also uses Radix's AccessibleIcon, so you can specify an accessibility label as:

          <Icon icon="lucide:search" label="Search" />
        

To adjust the size of the icon, simply use Tailwind:

          <Icon icon="lucide:search" label="Search" className="tw:size-6" />
        

Let's! For more on its family components to use, and more demos on showing how versatile this component can be, check the API reference page.

Q&A