https://github.com/Samitier/pixel-icon

A micro javascript icon editor
https://github.com/Samitier/pixel-icon

icon-generator icons vanilla-javascript

Last synced: about 1 month ago
JSON representation

A micro javascript icon editor

• Host: GitHub
• URL: https://github.com/Samitier/pixel-icon
• Owner: Samitier
• Created: 2019-03-10T20:12:51.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-03-02T20:27:16.000Z (over 1 year ago)
• Last Synced: 2024-04-23T06:59:36.171Z (5 months ago)
• Topics: icon-generator, icons, vanilla-javascript
• Language: TypeScript
• Homepage: https://samitier.github.io/pixel-icon/
• Size: 438 KB
• Stars: 7
• Watchers: 2
• Forks: 0
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# PIXEL ICON JS

The simplest javascript icon editor.

## What is this?

It's a very simple library to create and render your own icons by just providing a codified string.

## How do I use it?

First, go to [the editor](https://samitier.github.io/pixel-icon/) and create an icon. Copy the resulting code to your project and the icon will render as an `img` tag.

## Options & advanced usage

You can pass an options object when rendering an icon. Here's a full feature example:

```js

import PixelIcon from "pixel-icon"

PixelIcon(yourContainer, yourIconCode, {

	// color palette of your image.

	colors: [

		"#000",

		"#47A8BD",

		"#9FD356",

		"#9C3848",

		"#FFF"

	],

	// if true, renders a border between each pixel to create a grid-like image 

	hasBorder: false, 

	// number of vertical and horizontal pixels

	size: 20

})

```

The properties `size` and `colors` will directly affect the size of the codified image as

it will need more characters to be rendered.