https://github.com/klaufel/aseprite-css
Generated pixel art with CSS box shadow property based a svg image exported by Aseprite.
https://github.com/klaufel/aseprite-css
aseprite css pixel-art
Last synced: about 1 year ago
JSON representation
Generated pixel art with CSS box shadow property based a svg image exported by Aseprite.
- Host: GitHub
- URL: https://github.com/klaufel/aseprite-css
- Owner: klaufel
- License: mit
- Created: 2021-01-08T13:52:20.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2021-01-08T17:38:10.000Z (over 5 years ago)
- Last Synced: 2024-04-25T23:45:01.452Z (about 2 years ago)
- Topics: aseprite, css, pixel-art
- Language: JavaScript
- Homepage:
- Size: 12.7 KB
- Stars: 13
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Aseprite CSS
Generated pixel art with CSS box shadow property based a svg image exported by Aseprite
## :fire: Overview
CSS is awesome! Dot!
## :rocket: Usage
### 1. Export Aseprite SVG image
Save as "SVG" image file in your aseprite.
### 2. Install `aseprite-css` globally
```sh
npm install aseprite-css -g
```
### 3. Generate CSS pixel art
```sh
aseprite-css [source]
```
#### Example
_Default:_
```sh
aseprite-css my-pixelart.svg
```
_With custom pixel size:_
```sh
aseprite-css my-pixelart.svg 10
```
#### Ouput
```css
html {
width: 1px;
height: 1px;
box-shadow: 5px 1px 0 #000000, 6px 1px 0 #000000, 4px 2px 0 #000000, 5px 2px 0
#ffffff, 6px 2px 0 #ffffff, 7px 2px 0 #000000, 3px 3px 0 #000000, 4px 3px
0 #5b6ee1, 5px 3px 0 #ffffff, 6px 3px 0 #ffffff, 7px 3px 0 #ffffff, 8px
3px 0 #000000, 3px 4px 0 #000000, 4px 4px 0 #5b6ee1, 5px 4px 0 #ffffff, 6px
4px 0 #bd9f81, 7px 4px 0 #ffffff, 8px 4px 0 #ffffff, 9px 4px 0 #000000, 3px
5px 0 #000000, 4px 5px 0 #5b6ee1, 5px 5px 0 #ffffff, 6px 5px 0 #bd9f81, 7px
5px 0 #bd9f81, 8px 5px 0 #ffffff, 9px 5px 0 #ffffff, 10px 5px 0 #000000, 3px
6px 0 #000000, 4px 6px 0 #5b6ee1, 5px 6px 0 #ffffff, 6px 6px 0 #bd9f81, 7px
6px 0 #e5bd94, 8px 6px 0 #bd9f81, 9px 6px 0 #ffffff, 10px 6px 0 #ffffff, 11px
6px 0 #000000, 3px 7px 0 #000000, 4px 7px 0 #5b6ee1, 5px 7px 0 #ffffff, 6px
7px 0 #e5bd94, 7px 7px 0 #ffffff, 8px 7px 0 #ffffff, 9px 7px 0 #bd9f81, 10px
7px 0 #ffffff, 11px 7px 0 #ffffff, 12px 7px 0 #000000, 3px 8px 0 #000000, 4px
8px 0 #5b6ee1, 5px 8px 0 #ffffff, 6px 8px 0 #e5bd94, 7px 8px 0 #ffffff, 8px
8px 0 #ffffff, 9px 8px 0 #ffffff, 10px 8px 0 #bd9f81, 11px 8px 0 #ffffff, 12px
8px 0 #ffffff, 13px 8px 0 #000000, 3px 9px 0 #000000, 4px 9px 0 #5b6ee1;
}
```
## License
MIT © [klaufel](https://github.com/klaufel)