Loading…
448 original, open line icons for your product. Search, recolour, resize, then copy or download as SVG, PNG, React or CSS.
Use it from npm
Import one and the bundler drops the other 447. They inherit currentColor, so colour stays in your CSS.
npm install adysreBrings the design tokens and tells Tailwind to scan the package. Skip it and import the pre-compiled stylesheet instead.
@import "tailwindcss";
@import "adysre/styles.css";Its own entry point, so nothing else comes along for the ride.
import { ArrowUpRight, Search } from 'adysre/icons';
export function Toolbar() {
return (
<>
{/* 24px and currentColor by default — colour comes from CSS. */}
<Search />
<ArrowUpRight size={32} strokeWidth={2} className="text-blue-600" />
{/* Icons are aria-hidden unless you name them. */}
<ArrowUpRight aria-label="Open in a new tab" />
</>
);
}
// When the name is data rather than something you can write down:
import { Icon } from 'adysre/icons';
<Icon name={page.iconName} size={20} />;