Skip to content

qmisslin/icon-creator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Icon Creator Logo

Icon Creator

Launch Icon Creator

Icon Creator is a small web utility designed to convert any image or vector icon into a standardized SVG format identical to FontAwesome specifications. It normalizes paths, scales coordinates to a strict 640x640 viewBox, and outputs clean, production-ready code.

User interface

Philosophy

This project is built on the core principle of a free and open internet. High-quality tools should be accessible to everyone without paywalls or closed ecosystems. You are entirely free to use, modify, and distribute this software however you see fit.

Features and Interface

The application is built with a minimal, modern interface. Below is a detailed breakdown of the available features.

Input Methods

You can import your assets directly into the application without navigating complex menus. The entire interface acts as a drop zone. You can drag and drop an image or an SVG file, or simply paste it from your clipboard. The application automatically detects the file type and processes it accordingly.

Input feature

Theme Toggle

The interface supports both light and dark modes to match your system preferences or working environment. Use the toggle button in the header to switch between themes manually.

Theme Toggle button

Tracing Detail Control

When uploading a raster image (PNG, JPG), the application automatically traces it into a vector path. The "Tracing Detail" slider allows you to adjust the curve optimization tolerance. A lower value strictly follows the original pixels, while a higher value creates smoother, more optimized curves.

Tracing Detail slider

Point Visualization

For debugging or detailed inspection, you can toggle the visibility of the vector anchor points on the generated shape. This helps verify the complexity and structure of the resulting path.

Show Points toggle

Output Formatting Modes

The application can format the generated vector data in two distinct ways to suit your development needs:

  • Complete SVG: Wraps the generated path in a standard <svg> tag with a 0 0 640 640 viewBox, ready to be embedded in HTML.
  • PATH Only: Outputs only the d="..." attribute data, which is ideal if you are managing your own SVG components or icons libraries.

Output formatting modes

Export Options

Once your icon is processed, you can extract the code immediately. The output panel provides a "Copy" button to send the code directly to your clipboard, and a "Download" button to save the result as an .svg or .txt file, depending on your selected output mode.

Local Usage

This application runs entirely in the browser using standard web technologies. However, due to ECMAScript module security policies, it must be served via a local web server rather than opened directly as a file.

Clone the repository and serve the directory using any basic HTTP server (such as Python's http.server or Node's serve), then open the provided localhost address in your web browser.

License

This project is released under the MIT License. You have the absolute freedom to do whatever you want with this code. Use it, break it, modify it, or integrate it into your own commercial or personal projects.

About

Icon Creator is a small web utility designed to convert any image or vector icon into a standardized SVG format

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors