Awesome

SVG Icon to Framework component

Small tool to generate a framework component (React, Preact, Angular, Vue, Vue3 or Svelte) from a SVG icons. Drop or paste your SVG icon content to the tool and you will have a basic framework template to use the svg icon in your project.

Test and use in live

https://svg-icon-2-fw-component.dimaslz.dev

How to run

npm run install or yarn install
npm run dev or yarn dev

By default, you will have http://localhost:3000, if you want to change the port, run --port XXXX after dev command

Scripts

Npm Script	Description
`dev`	run project to develop in local watching any change
`build`	build project run as `NODE_ENV=production yarn build`
`start`	once the project is built, serve the distribution content
`test`	run tests (verbose by default) with watch by default (not watch in CI)
`test run`	run tests (verbose by default) just one time
`test:coverage`	run tests (and verbose) and linten for changes
`lint`	lint code

Author

{
  "name": "Dimas López Zurita",
  "role": "Senior Software Engineer",
  "alias": "dimaslz",
  "linkedin": "https://www.linkedin.com/in/dimaslopezzurita",
  "github": "https://github.com/dimaslz",
  "twitter": "https://twitter.com/dimaslz",
  "tags": "tooling, docker, tailwindcss, vue, SAAS, nodejs+express"
}

My other projects

https://ng-heroicons.dimaslz.dev/: An Angular components library to use Heroicons.com in your Angular projects.
https://randomdata.loremapi.io/: A tool to create mock Api responses with your custom schema.
https://svg-icon-2-fw-component.dimaslz.dev: A tool to create a framework icon component from a SVG
https://loremapi.io: Mock and document your Api's
https://cv.dimaslz.dev: My online CV
https://api.dimaslz.dev: My professional info by API
https://dimaslz.dev: Dev landing
https://dimaslz.com: Profesional landing profile