Tweak UI

Live tweak panels for numbers, colors, vectors and more.

Declarative Builder

Compose panels from numbers, vectors, colors, selects and more, plus layout containers like groups, tabs and split panes.

Built on Mithril.js, components are plain functions, meaning that custom controls can be added without the need for a compiler.

A minimal CSS vocabulary of classes and custom properties. Just enough for small projects.

Explore the style guide

Install

shell

npm install tweak-ui

Import

import { mountUi } from 'tweak-ui'

Find stylehseets

node_modules/tweak-ui/tweak-ui.css

Create an HTML container where Tweak UI should render.

html

<div class="my-element"></div>

Mount your controls

mountUi('.my-element', (ui) => {
  // ... builder function for static controls
})

Or with full mithril control

mountUi('.my-element', {
  view: () => {
    // ... mithril view function for dynamic controls
  },
})