1. tweakpane
A compact pane for fine-tuning parameters and monitoring value changes
tweakpane
Package: tweakpane
Created by: cocopon
Last modified: Fri, 22 Dec 2023 13:25:30 GMT
Version: 4.0.3
License: MIT
Downloads: 348,835
Repository: https://github.com/cocopon/tweakpane

Install

npm install tweakpane
yarn add tweakpane

Tweakpane

CI
Coverage Status
npm version

cover

Tweakpane is a compact pane library for fine-tuning parameters and monitoring
value changes, inspired by dat.GUI.

  • Clean and simple design
  • Dependency-free
  • Extensible

(dat.GUI user? The migration guide can be helpful)

Installation

Refer to the Getting Started section for concrete steps. Remember to install @tweakpane/core if you are developing with TypeScript.

Features

See the official page for details.

Bindings

Number, String, Boolean, Color, Point 2D/3D/4D

Bindings

Readonly bindings

Number, String, Boolean

Readonly bindings

UI components

Folder, Tab, Button, Separator

UI components

Theming

Theming

Plugins

Plugins

Misc

  • Mobile support
  • TypeScript type definitions
  • JSON import / export

Development

CommonJS and ES modules

From version 4, Tweakpane has been migrated to ES modules. If you are looking for a CommonJS version of the package, use version 3.x.

Build your own Tweakpane

$ npm install
$ npm run setup
$ cd packages/tweakpane
$ npm start

The above commands start a web server for the document, build source files, and
watch for changes. Open http://localhost:8080/ to browse the document.

License

MIT License. See LICENSE.txt for more information.

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code