(Help) What / How do you use Icons in Svelte ?

• feather

  101 24,460 6.8 JavaScript

  Simply beautiful open-source icons

  

Below is a list of My Source for SVG / vector. Though Not direct answer for your question. May help indirectly :) --- https://www.svgrepo.com Explore, search and find the best fitting icons or vectors for your projects using wide variety vector library. Download free SVG Vectors for commercial use. --- https://www.svgbackgrounds.com Customize and apply backgrounds fast SVGs enable full-screen hi-res visuals with a file-size near 5KB and are well-supported by all modern browsers. What's not to love? --- https://www.visiwig.com click + paste graphics, that elevate your website and brand visuals --- https://jakearchibald.github.io/svgomg/ A Tool to compress SVG. SVGOMG (https://github.com/jakearchibald/svgomg) is SVGO's (https://github.com/svg/svgo) Missing GUI, aiming to expose the majority, if not all the configuration options of SVGO. --- https://feathericons.com Simply beautiful open source icons. Color, Size & Stroke can be changed from site. --- https://vecta.io/nano Nano uses lossless techniques to compress inefficient SVG codes by removing unnecessary data, resulting in the same image, but large differences in file size! --- https://vecta.io/symbols Flow chart, AWS, Google and Azure cloud symbols. Especially good for Brand logos.

• svelte-starter

  3 339 7.3 Svelte

  A Svelte starter template for projects

  

We use feather-icons (installed via npm) and have a helper component to allow for customization

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• svelte-icons

  4 282 0.0 Svelte

  Icon components for svelte

  

• MaterialDesign

  56 10,874 9.1

  ✒7000+ Material Design Icons from the Community

I use Material Icons Community (https://materialdesignicons.com/) which is based on Google's Material Icons but with a pile of community icon contributions.

• svgomg

  77 5,649 5.9 JavaScript

  Web GUI for SVGO

Below is a list of My Source for SVG / vector. Though Not direct answer for your question. May help indirectly :) --- https://www.svgrepo.com Explore, search and find the best fitting icons or vectors for your projects using wide variety vector library. Download free SVG Vectors for commercial use. --- https://www.svgbackgrounds.com Customize and apply backgrounds fast SVGs enable full-screen hi-res visuals with a file-size near 5KB and are well-supported by all modern browsers. What's not to love? --- https://www.visiwig.com click + paste graphics, that elevate your website and brand visuals --- https://jakearchibald.github.io/svgomg/ A Tool to compress SVG. SVGOMG (https://github.com/jakearchibald/svgomg) is SVGO's (https://github.com/svg/svgo) Missing GUI, aiming to expose the majority, if not all the configuration options of SVGO. --- https://feathericons.com Simply beautiful open source icons. Color, Size & Stroke can be changed from site. --- https://vecta.io/nano Nano uses lossless techniques to compress inefficient SVG codes by removing unnecessary data, resulting in the same image, but large differences in file size! --- https://vecta.io/symbols Flow chart, AWS, Google and Azure cloud symbols. Especially good for Brand logos.

• svgo

  29 20,349 9.0 JavaScript

  ⚙️ Node.js tool for optimizing SVG files

  

Below is a list of My Source for SVG / vector. Though Not direct answer for your question. May help indirectly :) --- https://www.svgrepo.com Explore, search and find the best fitting icons or vectors for your projects using wide variety vector library. Download free SVG Vectors for commercial use. --- https://www.svgbackgrounds.com Customize and apply backgrounds fast SVGs enable full-screen hi-res visuals with a file-size near 5KB and are well-supported by all modern browsers. What's not to love? --- https://www.visiwig.com click + paste graphics, that elevate your website and brand visuals --- https://jakearchibald.github.io/svgomg/ A Tool to compress SVG. SVGOMG (https://github.com/jakearchibald/svgomg) is SVGO's (https://github.com/svg/svgo) Missing GUI, aiming to expose the majority, if not all the configuration options of SVGO. --- https://feathericons.com Simply beautiful open source icons. Color, Size & Stroke can be changed from site. --- https://vecta.io/nano Nano uses lossless techniques to compress inefficient SVG codes by removing unnecessary data, resulting in the same image, but large differences in file size! --- https://vecta.io/symbols Flow chart, AWS, Google and Azure cloud symbols. Especially good for Brand logos.

• Beatbump

  41 989 4.8 TypeScript

  Alternative YouTube Music frontend built with Svelte/SvelteKit 🎧

I use Feather Icons but the package on NPM is a major contributor to bundle size, at least the one I used. So I just use an Icon component (here) and I copy the icon SVG data and then pass in custom parameters and the name of the icon. Works well for me

• WorkOS

  workos.com sponsored

  The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

  

Suggest a related project