Engineered for speed. Made to scale.

Build fast, accessible interfaces with beautiful 100+ components — powered by Ark UI and PandaCSS.

Go to docs

Switch

ArkPandacssMoto

{ name: "John Doe", age: 30, email: "john.doe@example.com", … }

name: "John Doe"

age: 30

email: "john.doe@example.com"

isDeveloper: true

skills: (3) [ "React", "TypeScript", "Panda CSS" ]

address: { street: "123 Main St", city: "Anytown", zip: "12345" }

lastLogin: "2026-07-23T22:33:38.152Z"

settings: null

How to Install

Download the Moto UI packages using your preferred package manager.

Prerequisites

Before jumping in, make sure your Panda project is all set up. If you haven't done that yet, check out pandacss installation guide and once you've completed that, come back to this guide.

Install dependencies

Moto UI is built on Ark UI acting as its headless framework, which delivers a collection of unstyled, accessible components.

Update Panda config file

Configure your Panda CSS setup by adding the required settings to your config file.

Usage

Start building with Moto UI by importing the components you need from the appropriate packages.