Skip to content

DimensionLab/leva

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

npm (tag) npm bundle size GitHub Workflow Status Discord Shield


A GUI you are going to lava.
Customizable, extensible and beautiful by default.



🚧🚧 This repo is under heavy development 🚧🚧

Features

  • ⭐️ Beautiful by default
  • 🎚 More than 12 different kinds of inputs available
  • 🧐 Smart input type recognition
  • πŸ”Œ Easy-to-make plugins
  • βœ… Keyboard accessible
  • ⚑️ No setup necessary

Installation

npm i leva

Quick start

Simply call the useControls hook from anywhere in your app:

import { useControls } from 'leva'

function MyComponent() {
  const { name, aNumber } = useControls({ name: 'World', aNumber: 0 })

  return (
    <div>
      Hey {name}, hello! {aNumber}
    </div>
  )
}

NOTE: Using Leva with React 18 will cause a console error about createRoot which you can safely ignore, or fix by following the instructions here: discussion

Documentation

Contributors ✨

Thanks goes to these wonderful people (emoji key):


Andrew Prifer

πŸ€” πŸ’»

Aria

πŸ€”

David Bismut

πŸ€” πŸ’»

Dmitry Ivakhnenko

πŸ’»

Gianmarco

πŸ€” πŸ’»

Guido Vizoso

πŸ’»

Han

🎨

Ivan Rossi

πŸ›

Laurin Quast

πŸ’» πŸ€”

Marco Fugaro

πŸ€”

Marco Ludovico Perego

πŸ€”

Piotr Monwid-Olechnowicz

πŸ“–

clementcassajus

🎨

thephoenixofthevoid

πŸ›

This project follows the all-contributors specification. Contributions of any kind welcome!

About

πŸŒ‹ React-first components GUI

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 98.1%
  • JavaScript 1.8%
  • Other 0.1%