• Icon - The Icon component.

import { Icon } from "@dreamy-ui/react/rsc";

Since Dream does not provide any icons, you will want to use other icon libraries like react-icons, lucide-react or @heroicons/react.

<Icon as={FiCoffee} />

Use color prop to set the color of the icon. You may also want to use fill or stroke prop to set the other icon values.

<Icon color="fg.medium" as={FiCoffee} />

with asChild prop Dream will merge child component with Icon, or with asComp prop Dream will merge component with Icon.

<Icon asChild>
  <FiCoffee />
</Icon>
<Icon asComp={<FiCoffee />} />