by dataarts

dataarts / dat.gui

dat.gui is a lightweight controller library for JavaScript.

4.9K Stars 819 Forks Last release: over 3 years ago (v0.6.5) Apache License 2.0 597 Commits 23 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:


A lightweight graphical user interface for changing variables in JavaScript.

Get started with dat.GUI by reading the tutorial or the API documentation.

Packaged Builds

The easiest way to use dat.GUI in your code is by using the built source at

. These built JavaScript files bundle all the necessary dependencies to run dat.GUI.

In your

tag, include the following code:

Installing from npm

$ npm install --save dat.gui
// CommonJS:
const dat = require('dat.gui');

// ES6: import * as dat from 'dat.gui';

const gui = new dat.GUI();

Directory Contents

├── build - Compiled source code.
├── src - Source files.
└── tests - Tests.

Building your own dat.GUI

In the terminal, enter the following:

$ npm install
$ npm run build

npm scripts

  • npm run build - Build development and production version of scripts.
  • npm run dev - Build development version of script and watch for changes.

Working with Content Security Policy

If you're using a server with a Content Security Policy in place that blocks 'unsafe-inline', you will have problems when dat.gui.js tries to inject style information. To get around this, load 'build/dat.gui.css' as an external style sheet.


View the Change Log


The following libraries / open-source projects were used in the development of dat.GUI: * Rollup * Sass * Node.js * QUnit / jquery

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.