Drawing shapes are very easy, like <circle></circle> <square></square>
CSS JavaScript HTML
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
lib fix triangle default directions, left, down, right.... etc Oct 21, 2016
node_modules adding node module Oct 2, 2016
resources/assets Update bootstrap.js Oct 24, 2016
.gitignore from local Oct 2, 2016
LICENSE Update LICENSE Oct 13, 2016
gulpfile.js first commit Oct 2, 2016
index.html first commit Oct 2, 2016
package.json first commit Oct 2, 2016


Supporting Shapecss Awesome

ShapeCss is an MIT-licensed open source project. Its ongoing development is made possible thanks to the support by these awesome backer. If you'd like to join them, check out shapecss.com' developers campaign.


We found making geometrical shape is not easy but its cumbersome, and need to write many lines of css and javascripts. So we wanted to make it flexable like tag, like h1, h2 or p or body. So you can use this tags, circle, triangle, square, rectangle, parallelogram.

Please download this two files from here


<link href="https://www.shapecss.com/public/shape.css" rel="stylesheet">
<!--IMPORTANT: script must be add in the bottom of the body tag-->
<script src="https://www.shapecss.com/public/shape.js"></script>


<!--basic circle, easy-->

<!--circle with radius 400px and background blue-->
<circle shape-background="blue" shape-radius="400px"><circle> 


check shapecss website and find easy and clean documentation.


If you find any bug or want to contribute, you are always welcome by submitting a pull request

Stay in touch

For latest releases, announcements and fun, follow on Twitter: @microdreamit