Icons

import { SearchLg } from "@untitledui/icons"   // nx-ui's set
import { Search } from "lucide-react"            // also supported in app code

<SearchLg className="size-5 text-fg-quaternary" />
<Search className="size-5 text-fg-quaternary" />

1. Editing a file that came from nx-ui (components/ui/*, components/blocks/*)? Use @untitledui/icons. It keeps the file diffable against the registry and nx-ui-doctor check clean.
2. Writing your own app code (routes, features, layouts)? Either set. Pick whichever names the glyph you actually want — lucide has ~1,770 unique icons to untitledui's 1,179 and covers brand and domain glyphs untitledui lacks; untitledui has the 01/Lg variant families and matches the design language the rest of nx-ui came from.
3. Within one visual cluster (a button row, a nav column, a card header), stay in one set. The weight matches, but the two sets use different corner radii and glyph metaphors, so a mixed row can read as slightly inconsistent even though nothing is technically wrong.
4. Never mix by accident. If a file already imports SearchLg from untitledui, do not add Search from lucide to it — consolidate.
5. Passing an icon into an nx-ui icon prop? Both sets work. Pass the component itself, not an element: icon={Activity}, not icon={<Activity />}— both render, but only the component form receives the component's data-icon and sizing classes.