Toggle menu
Keyline IconsIcons
Browse 10928 free Keyline Icons SVG icons. Download SVG, copy as JSX, PNG or Base64. MIT licensed. Designed by Keyline Icons. Styles: Precise Shapes, Has Padding, Uses Stroke.
Recently added in Keyline Icons
648 icons added on 11 October 2026. See every pack's latest additions
a-arrow-down
a-arrow-up
arrow-down-up
arrow-down-up-2
arrow-left-right-2
arrow-right-left-2
arrow-up-down-2
bandage
battery-charging
bike-2
braces
brackets
circle-progress-arrow-up
circle-progress-plus
cloud-network
cloud-search
database-cog
dot
file-cog
folder-cog
gavel
glasses
globe-cog
hand-coins
heart-crack
heart-pulse
home-check
home-heart
home-simple
home-x
homes
house
house-cast
house-check
house-chimney
house-cog
house-heart
house-plug
house-plus
house-simple
house-wifi
house-x
house-zap
houses
id-badge
image-off
list-filter
list-todo
Showing 48 of 648 new icons. Search the browser above to find the rest.
Copy & download Keyline Icons icons
Click any icon above to open the detail panel. Four export formats are available instantly, no sign-up required.
Raw vector markup. Paste directly into HTML or React components. Scales to any size without quality loss.
React-ready component. Drop into any React or Next.js project. Works with shadcn/ui, Radix, and Tailwind CSS.
Raster export at 1×, 2× and 3× for email templates, Figma imports, app assets, and Open Graph images.
Inline data URI, embed icons in CSS background-image, email HTML, or anywhere an image URL is needed.
Works with shadcn/ui
Copy the JSX format and paste directly into any shadcn/ui component. Alternatively, install@keyline-icons/reactand use via @iconify/react, fully tree-shakeable, no icon font loading required.
About Keyline Icons
Keyline Icons is a free MIT-licensed icon library of more than 1,200 icons, each drawn in eight styles: stroke, two-tone, duotone and fill, in both rounded and sharp versions. Stroke icons use 2px keylines on a 24px grid. Two-tone places the stroke drawing over a soft plate, duotone drops the outline for a grey body with full-strength detail, and fill is solid with the detail knocked out. The sharp family uses butt caps and square corners and is drawn separately, not filtered from the rounded set, so it holds up in strict, angular interfaces. The library is built with shadcn/ui in mind and ships a shadcn registry, a React package (@keyline-icons/react) with per-style entry points and a React Native package. Coverage spans arrows, git, files, charts, AI, science, health, food, weather and transport, with container forms (square and circle) for many icons. Search all Keyline styles here, copy SVG, export JSX or download PNG. Compared with Lucide, Keyline trades size for style depth. Ideal for shadcn/ui apps and design systems that need filled and outline states from one source.
Created By
License
Features & Tags
Pack Details
Color Support
Monochrome
Category
UI 24px
How to use Keyline Icons icons
Package
@keyline-icons/react
License SPDX
MIT
Grid Size
24px
Sample Icons
arrow-up-narrow-wide-duotone, credit-card-fill, upload
Install
npm install @keyline-icons/reactReact
import { ArrowUpRight, Check, Menu } from '@keyline-icons/react';
import { Check as CheckFill } from '@keyline-icons/react/fill';
export default function App() {
return <ArrowUpRight size={20} />;
}Via Iconify · HTML
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="keyline-icons:icon-name" width="24"></iconify-icon>Via Iconify · any framework
import { Icon } from '@iconify/react';
export default function App() {
return <Icon icon="keyline-icons:icon-name" width={24} />;
}Package stats
Build-time npm metadata cached weekly • Last refresh Oct 11, 2026
@keyline-icons/react
Icons on one 24×24 grid, as React components in four styles: stroke, two-tone, duotone and fill, each in rounded or sharp corners. Built for shadcn/ui.
License
MIT
Weekly downloads
2,999
Monthly downloads
8,655
Total downloads
11,130
Unpacked size
9.2 MB
Last published
Oct 11, 2026
Registry updated
Oct 11, 2026
Compare Keyline Icons with similar icon packs
Frequently Asked Questions
Which styles does Keyline Icons include?
What is the difference between rounded and sharp Keyline icons?
Is Keyline Icons made for shadcn/ui?
@keyline-icons/react, with separate entry points such as @keyline-icons/react/fill, /duotone and /sharp for the other styles.