Icons

The line icon set used across the design system: 20/24px grid, 1.67px stroke, rounded caps and joins, always drawn with currentColor so they inherit text color. The full 1,000+ icon library lives in the Core Figma file (Icons page); the set below ships with the code packages today.

Usage

// All icons are plain React SVG components - 20 or 24px grid,
// 1.67px stroke, round caps, currentColor.
import { MailIcon, SearchIcon, HomeIcon } from "@adek/ui-react/icons";

<MailIcon />
<SearchIcon width={24} height={24} />
<HomeIcon style={{ color: "var(--brand-500)" }} />

General icons

Application icons

Need more?

Any icon on the Icons page of the Core Figma file can be exported as SVG and dropped into components/ui/icons.tsx following the same pattern. Ask the design team (design@adek.gov.ae) to export a batch if you need a category.