Skip to content
Dethink Components
Dethink studio

Getting startedIntroduction

Introduction

React components for dashboards, forms, and AI apps. Use the source code, try the examples, and adapt them to your product.

On this page

Start here

Set up your project

Run the docs locally and use the workspace package.

Find a component

Try live examples and copy the code into your app.

Make it yours

Change colors, spacing, and light or dark mode.

Using the docs

Every component page follows the same path.

  1. Installation. Set up the package before using a component.
  2. Usage. Start with the import or a small code example.
  3. Examples. Try sizes, states, and common uses. Open the code below any preview to copy it.
  4. Props. Look up what each option does, its accepted values, and its default.

Recipes combine components into larger examples, such as a form or a settings panel. Use the page links to jump to the part you need.

Before you start

You will need a React project with TypeScript. Dethink uses Tailwind CSS v4 and shared CSS variables for styling. The components include keyboard and screen reader support; your app still needs clear labels and a sensible focus order.

Dethink is in active development. You can use it in this repository today. The npm package and public registry are not published yet.