Line icons
Line icons
pixel-crisp, infinitely scalable.
202 line icons packs
19,060 icons
About line icons
Line icons,
done right.
- Product & dashboard UI
- Mobile navigation
- Marketing sites
- Design systems
Line icons (also called outline or stroke icons) are built from a single uniform stroke with no fill. Because every glyph shares the same weight, optical size and corner radius, they read as one coherent family — the reason line icons dominate modern product UI, dashboards and mobile apps.
Every Roundicons line set is drawn on a 24px grid with a fixed stroke so icons stay pixel-crisp at 16px and razor-sharp when scaled to billboard size. Because they ship as true vectors (SVG and AI), you can recolour, restroke or animate them without ever touching a raster editor.
You get each icon in SVG, PNG (multiple sizes), layered AI source and an IconJar archive — drop them straight into Figma, Sketch, Webflow, iOS, Android or any web build.
Where line icons work best
Built for the places people actually use them.
App navigation
Tab bars, sidebars and menus where a light, even stroke keeps the chrome quiet and the content loud.
Settings & forms
Long lists of options read fastest with a single consistent line weight at 20–24px.
Marketing feature rows
Pair a line icon with a short headline to break up a landing page without heavy colour.
Design systems
One stroke width and grid means the whole set drops into a component library as a coherent token set.
What you get
Every format,
fully editable.
- Formats
- SVG · PNG (multiple sizes) · layered AI source · IconJar archive
- Grid
- Drawn on a consistent pixel-snapped grid so the whole family aligns
- Scaling
- True vectors — crisp from a 16px control to a billboard, with no quality loss
- Editing
- Recolour, restroke and export right in the browser, or in Figma, Illustrator & code
- Licensing
- Standard or Extended commercial license — or get every pack in the bundle
- Updates
- One year of free pack updates · 30-day money-back guarantee
Pairs well with
Solid icons
Bold, filled glyph icons with maximum presence. The clearest read at small sizes — perfect for tab bars, status indicators and anywhere an icon must be unmistakable.
Filled outline icons
An outline stroke with a soft accent fill — the duotone style that adds depth and a touch of colour while staying clean and modern.
FAQ
Frequently asked questions
What are line icons best used for?
Line icons suit interface design where clarity and lightness matter — navigation bars, settings screens, dashboards and feature lists. Their uniform stroke keeps a UI calm and legible at small sizes.
Can I change the stroke weight or colour?
Yes. Every line icon ships as an editable SVG and AI source, so you can recolour, adjust the stroke or combine them with your own components in Figma, Illustrator or code.
What formats do line icons come in?
SVG, PNG at multiple resolutions, layered AI source files, and an IconJar archive — ready for web, iOS, Android and design tools.
What size should line icons be in a UI?
Most interfaces use line icons at 20px or 24px. Our line sets are drawn on a 24px grid so they stay pixel-crisp at those sizes, and because they are vectors they scale cleanly to any larger size too.
Should I use line or solid icons for active states?
A common pattern is line icons for the default state and solid (glyph) icons for the active or selected state — the extra ink signals “you are here”. Our line and solid sets share proportions so they pair without looking mismatched.
The bundle
$1,358
for $1,358.
All 29 families. Every format. One payment, lifetime download access, 30-day money-back guarantee.