A stock icon rarely fits a design straight away. ICON OOP gives you fully customizable SVG icons: pick from 23,000+ icons and adjust colour, size, stroke weight and more before you download. The icon arrives matching your design instead of needing edits afterwards.
What you can customise
Every icon in ICON OOP can be adjusted before download:
- Colour - any colour, hex value, brand colour or swatch.
- Size - set the exact dimensions you need.
- Stroke weight - make outline icons thinner or bolder.
- Weight - Phosphor icons come in six weights from thin to fill.
- Background - add a coloured or rounded background tile.
- Padding and corner radius - control spacing and rounding.
- Rotation and flip - turn or mirror the icon.
Why customizable icons matter
Consistency is what makes an interface look professional. When every icon shares the same colour, size and stroke weight, a screen feels designed rather than assembled. Customizing each icon to the same settings before download is the easiest way to get that consistency, especially when you are pulling icons for one project.
Customise, then download in any format
Once an icon looks right, download it as an SVG, export it as a transparent PNG, or copy it as SVG code, a CSS data-URI or a React component. The customisation is baked into whatever format you choose.
Outline and solid icons, all adjustable
ICON OOP shows the controls that make sense for each icon. Outline icons get a stroke-weight slider; solid icons and logos get fill controls; Phosphor icons get a weight selector. You do not need to know the difference, the tool adapts. The icon sets page describes each collection’s style.
No design software needed
You do not need Illustrator, Figma or any installed software. All the customisation happens in your browser, and nothing is uploaded anywhere. It is the fastest way to get a customizable SVG icon that fits your project.