Four doors

The system map

Everything on OpenVibe.Design, in four places.

Your look, everywhere

Pick or make a theme once and every OpenVibe site wears it. Take it into your own app as code for the web, Android and iOS, and design pages on it with AI.

  • 50 themes to wear
  • 25 with a light side
  • 7 platforms to export to

What you can do

One theme, every site

Try a theme on a Live channel, a Chat room and a shop side by side. Every contrast check must pass, and colour-blind previews show it as everyone sees it. Use it, and the whole network wears it from its next page; any earlier look is one tap back. Comfort settings ride on top of any theme: more contrast, a readable font, colour-blind-safe colours, true black.

Open the studio

OpenVibe.Live

LIVE1.2k watching
GSeattle at night, chat picks the routegoosely · IRL
  • mmaru left at the light!
  • kkiwi the view from here 😮
  • tteddy clip that

OpenVibe.Chat

# night-owls · 38 here

  • aana anyone up for the surf race?
  • jjules in five, warming up on utopia
  • count me in
Message #night-owls

open.shoes

RunningTrailSize 10

  • Cloudrunner 2$119 $150Best price
  • Trail Pro$139
  • Daily 3$89 $110
  • Racer X$179

Make it with AI, on your theme

Describe what you need and three AI designers draft it at once. Every draft wears your theme, so it already looks like it belongs.

Make something
  1. Describe itA page, an app screen or a component, in a sentence.
  2. Three models draft itAt once, on your theme, at phone and desktop sizes.
  3. Make it yoursPick one, click any part to change it or ask for a change, and keep every version.

See which AI designs best

The Arena sends one prompt to three models, shows two drafts without their names, and ranks the designers by the votes, with what each draft cost and how long it took. Every prompt, page and vote is open data.

Vote in the Arena

The models' names stay hidden until you vote.

The whole system

Everything

Everything an OpenVibe interface is made of, in one place: the same parts on every site, and in the apps.

Themes to wear

All 50 in the studio

More on Design

Your theme, in your app

3 links

Your theme, in your app

Every theme is a set of W3C design tokens. The same values reach the web as CSS variables, Android as a Compose colour scheme and iOS as SwiftUI colours, so a native app wears your theme without being a web page in a frame. The Kotlin and Swift output is compiled on every change, and AI assistants read every theme and component through the Design MCP server.

Android
MaterialTheme(
    colorScheme = if (isSystemInDarkTheme()) VibeDarkColorScheme
                  else VibeLightColorScheme,
) { App() }
iOS
Text("Live now")
    .foregroundStyle(VibeDarkTokens.colorTextPrimary)
    .padding(OvScale.spaceLg)
    .background(VibeDarkTokens.colorBgRaised,
                in: .rect(cornerRadius: OvScale.radiusMd))
Web
curl "https://openvibe.design/api/v1/tokens/vibe?format=css" > vibe.css

.card { background: var(--ov-color-bg-raised);
        border-radius: var(--ov-radius-md); }

Questions

5 questions

Questions

Where does my theme apply?

Everywhere you are signed in to OpenVibe: the theme lives on your account, and every site picks it up on its next page.

Can I use it in my own app?

Yes. Tokens gives any theme as CSS variables, a Tailwind config, a Jetpack Compose colour scheme, SwiftUI colours, a Flutter colour scheme, Figma variables or W3C design-token JSON, with its light and dark halves together. The API is open.

Can I undo a change?

Yes. Every change keeps the look it replaced; the history on the Themes page brings any of the last fifty back.

Can others use my theme?

Submit it to the gallery. A person reviews each submission before anyone else sees it.

What is coming next?

Publishing a design straight to OpenVibe.Website and OpenVibe.Space, brand kits that dress a creator's channel, overlays and shop in one go, and the kit's components as native Android and iOS views.