Launch Premium UIs at warp speed
Fully Open Source

Stop reinventing the wheel. Ship production-ready premium animated React components with 10x faster speed, built with Tailwind CSS and Framer Motion.

Get Started Browse ComponentsB


  import { MusicPlayer } from "@/components/sora-ui/music-player"

  export default function App() {
    return (
      <MusicPlayer
        theme="dark"
        autoPlay={false}
        onTrackChange={(track) => console.log('Playing:', track.title)}
      />
    ) 
  }


  import { MusicPlayer } from "@/components/sora-ui/music-player"

  export default function App() {
    return (
      <MusicPlayer
        theme="dark"
        autoPlay={false}
        onTrackChange={(track) => console.log('Playing:', track.title)}
      />
    ) 
  }

Features

Why choose SoraUI?

Beautiful, customizable premium components that save you development time and effort.

Customizable

Easily adjust components with props and Tailwind classes for full control over styling, colors, and layout.

Copy & Paste

No dependencies or installs required. Copy the code into your project and start using it instantly.

Billing Settings

Pricing Tables

Upload Plan Card

Pricing

Customer Portal

Ready to Use

Production-ready components tested across browsers and devices—just import and use, no setup needed.

Open Source

Free to use and modify for any project with full source code access and community contributions.

10x Faster

Fast Development

Save weeks of work with pre-built billing components and focus on core business logic instead.

SHIFT

TAB

SPACE

Accessible

WCAG-compliant components with ARIA labels and keyboard support to ensure usability for all.

Components

Explore Interactive Premium Components

Interact with real-time animated elements designed to make your interfaces stand out.

Mavka

Forest Song

0:00/0:00

Quick Integration

Get your animated UI running in minutes

1. Installation

Get started with SoraUI in seconds. Choose between our CLI tool for complete project setup or add individual components using shadcn. Both methods provide TypeScript-first components with full theme integration.

One-command project initialization

Individual component installation

Automatic dependency management

Follow Installation

Install any component instantly

npx shadcn@latest add @sora-ui/music-player

npx shadcn@latest add @sora-ui/music-player

2. Configure Theming

Customize your components with our comprehensive theming system. Choose from pre-built themes like Cyberpunk, Elegant, or Minimal, or create your own using CSS variables for perfect brand integration.

10+ pre-built theme variants

CSS variable-based customization

Dark/light mode support

Play with Themes

Apply custom theme colors

1:root {
2  --primary: oklch(0.6 0.25 253);
3  --primary-foreground: oklch(0.985 0 0);
4  --secondary: oklch(0.97 0.01 253);
5  --radius: 0.625rem;
6}

1:root {
2  --primary: oklch(0.6 0.25 253);
3  --primary-foreground: oklch(0.985 0 0);
4  --secondary: oklch(0.97 0.01 253);
5  --radius: 0.625rem;
6}

3. Usage

Start building with production-ready components immediately. Import your chosen component, pass your configurations, and handle user interactions with simple callback functions. Full TypeScript support included.

Import and use instantly

TypeScript interfaces included

Callback-based event handling

Implement Usage

Use components with full TypeScript support

1import { MusicPlayer } from "@/components/sora-ui/music-player";
2
3<MusicPlayer
4  theme="dark"
5  autoPlay={false}
6  onTrackChange={(track) => console.log('Playing:', track.title)}
7/>

1import { MusicPlayer } from "@/components/sora-ui/music-player";
2
3<MusicPlayer
4  theme="dark"
5  autoPlay={false}
6  onTrackChange={(track) => console.log('Playing:', track.title)}
7/>

FAQs

Got Questions?
We’ve Got Answers

Join our community

Connect with other developers, get help, and contribute to the project

GitHub

View our open source code and contribute to the project

X/ Twitter

Discord

Join our community for support and discussions

Launch Premium UIs at warp speedFully Open Source