A tool to create sketchy backgrounds, shapes and lines
JavaScript HTML CSS
Permalink
Failed to load latest commit information.
docs Initial Commit Jul 29, 2015
examples Min-Value for density Jul 29, 2015
img Initial Commit Jul 29, 2015
lib Initial Commit Jul 29, 2015
LICENSE Initial commit Jul 28, 2015
README.md Formatting Jul 29, 2015
d3.sketchy.js Initial Commit Jul 29, 2015
d3.sketchy.min.js Initial Commit Jul 29, 2015

README.md

d3.sketchy

A tool to create sketchy backgrounds, shapes and lines

Sketchy Rectangles

The library was inspired by Handy by Jo Wood et al. The circle strokes use code from http://codepen.io/spencerthayer/pen/nhjwu by Spencer Thayer

The library can draw rectangles and circles

Sketchy Circle

Custom shapes defined by an array of points.

Sketchy Shape

Which can be drawn automatically or with custom path functions

Sketchy Shape

And of course outlines for rectangles

Sketchy Rectangle Stroke

and circles

Sketchy Circle Stroke

The density, angle and sketchiness can be customized through parameters and the thickness of the lines through css.

Here is an interactive customizer that lets you play around with the parameters.

For in-depth documentation take a look at the docs, there are also various examples.