Wired Elements

A set of common UI elements with a hand-drawn, sketchy look. These can be used for wireframes, mockups, or just the fun hand-drawn look.

Wired Elements are implemented as web components. Web components are awesome!

The elements are drawn with enough randomness that no two renderings will be exactly the same — just like two separate hand-drawn shapes.

Component Showcase View on Github

Here's a simple demo:

Using wired-element controls to change a sketchy circle drawn using rough.js.

Try It Now

Play with wired-elements live on StackBlitz playground:

Wired Elements playground
Wired Elements in React playground

Documentation

Instructions on how to use wired-elements can be found on wired-elements GitHub page.

Properties specific to individual control can be found on its GitHub page. Here's the list of all web components available.

Components

Component showcase of all the wired elements.

License

MIT License (c) Preet Shihn.