// the find
bytedance/IconPark
🍎Transform an SVG icon into multiple themes, and generate React icons,Vue icons,svg icons
IconPark is a 2000+ icon library from ByteDance that generates React, Vue, and plain SVG components from a single SVG source per icon. The key idea is that one source file produces four visual themes (outline, filled, two-tone, multi-color) by manipulating fill and stroke attributes at runtime rather than shipping four separate files per icon.
The single-source-to-multiple-themes approach is genuinely clever — you get four variations without 4x the maintenance burden. The cross-platform package split (@icon-park/react, @icon-park/vue, @icon-park/vue-next, @icon-park/svg) is clean and means you only ship what you need. Icons are drawn on a consistent 48x48 grid with stroke-based geometry, which makes them scale cleanly and respond to stroke-width tweaks in a way that pixel-drawn icons don't. The icons.json metadata file (name, author, category, tags) shipped with each NPM package is a nice touch for tooling and search.
The repo has been effectively abandoned since February 2023 — 2000 icons sounds like a lot until you hit a gap and realize there's no active maintainer to file a PR with. The theme customization API hands you raw SVG attribute manipulation through props, which works fine for simple cases but falls apart when you want to integrate with a design token system or CSS custom properties — everything has to go through the component API. No Solid, Svelte, or web-component builds exist, so if you're not on React or Vue you're stuck with the @icon-park/svg string package and wiring up your own components. ByteDance-specific icons (Bytedance, BytedanceMiniApp, etc.) are baked into the public set, which is a minor but real awkwardness if you're not in that ecosystem.