Skip to content

使用此项目, 快速进行CSS图像绘制. 项目内置了一些简明易懂的小示例供参考.

Notifications You must be signed in to change notification settings

Lionad-Morotar/css-pixel-drawing-quickset

Repository files navigation

CSS-drawing-quickset

Project Preview

    1. pixel draw

Generator Pixel-Picture based on Box-Shadow Attributes.

Preview:

Pixel-Picture Generator

Picture Structure

Generatored code like this:

<div 
  id="monster" 
  style="
    width: 3em; 
    height: 3em; 
    margin-right: 12em; 
    margin-bottom: 12em; 
    box-shadow: rgb(20, 108, 254) 0em 0em, rgb(20, 108, 254) 3em 0em, rgb(20, 108, 254) 6em 0em, rgb(20, 108, 254) 9em 0em, rgb(20, 108, 254) 12em 0em, rgb(20, 108, 254) 0em 3em, rgb(135, 135, 135) 3em 3em, rgb(20, 108, 254) 6em 3em, rgb(135, 135, 135) 9em 3em, rgb(20, 108, 254) 12em 3em, rgb(20, 108, 254) 0em 6em, rgb(20, 108, 254) 3em 6em, rgb(20, 108, 254) 6em 6em, rgb(20, 108, 254) 9em 6em, rgb(20, 108, 254) 12em 6em, rgb(20, 108, 254) 0em 9em, rgb(135, 135, 135) 3em 9em, rgb(135, 135, 135) 6em 9em, rgb(135, 135, 135) 9em 9em, rgb(20, 108, 254) 12em 9em, rgb(20, 108, 254) 0em 12em, rgb(20, 108, 254) 3em 12em, rgb(20, 108, 254) 6em 12em, rgb(20, 108, 254) 9em 12em, rgb(20, 108, 254) 12em 12em; 
    background-color: rgb(20, 108, 254);">
</div>

About

使用此项目, 快速进行CSS图像绘制. 项目内置了一些简明易懂的小示例供参考.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages