CSS GUIv0.0.247DocsPropertiesGitHubLog inSign up

Getting Started

Get going with CSS GUI in a few steps.

Installation

Install CSS GUI with npm:

npm install --save @compai/css-gui

Or yarn:

yarn add @compai/css-gui

Usage

Import the Editor and styled components to initialize controls and then render the element styles to your canvas.

import { useState } from 'react'
import { Editor, styled } from '@compai/css-gui'

export default function MyEditor() {
  const [styles, setStyles] = useState({
    fontSize: {
      value: 16,
      unit: 'px',
    },
  })

  return (
    <>
      <Editor styles={styles} onChange={setStyles} />
      <styled.p styles={styles}>Hello, world!</styled.p>
    </>
  )
}