This is a fork of the wired repo to fix es6 imports, also updates all Librarys and makes the Library usable in webcomponents Designer.

Wired Elements is a series of basic UI Elements that have a hand drawn look. These can be used for wireframes, mockups, or just the fun hand-drawn look.

Play with wired-elements:

Wired Elements in Designer

Wired Elements

Wired Elements in React

Wired Elements in Vue

Wired Elements in Svelte

The package (wired-elements) exports all components in the wired category. List of all wired elements can be found here.

Add wired-elements to your project:

npm i @node-projects/wired-elements

Or load the ES module directly through unpkg

<script type="module" src="https://unpkg.com/@node-projects/wired-elements?module"></script>

Import into your module script:

import { WiredButton, WiredInput } from "@node-projects/wired-elements"

or

import { WiredButton } from '@node-projects/wired-elements/lib/wired-button.js';
import { WiredInput } from '@node-projects/wired-elements/lib/wired-input.js';

<wired-input placeholder="Enter name"></wired-input>
<wired-button>Click Me</wired-button>

Learn about web components here.

To view details of each component - properties, events, css-properties, etc, are provided in the docs folder.

Demo of all components is available at wiredjs.com.

wired-elements was built using RoughJS and Lit.

MIT License (c) Preet Shihn