Gray Scale

Semantic Colors

Section Backgrounds

We use Geist as our primary font for a modern, clean appearance.

Special Elements

Syntax‑highlighted code blocks with optional typing animation. Uses Catppuccin Mocha color scheme.

Static Code Block

import { startPlatform } from '@unchainedshop/platform';

const engine = await startPlatform({
  modules: {
    products: true,
    orders: true,
  },
});

// Your commerce API is ready!
console.log('GraphQL:', engine.graphqlPath);

Animated Code Block

export default {
  theme: {
    extend: {
      colors: {
        brand: '#your-color',
      }
    }
  }
}

export default {
  theme: {
    extend: {
      colors: {
        brand: '#your-color',
      }
    }
  }
}

Animated AI chat interface showing market expansion workflow. Used in homepage and copilot page heroes.

Code and terminal display for developer‑focused content.

Inline command that copies itself to the clipboard. Used for quick‑start commands.

Cards use plain text links (card-link class) instead of buttons

CTA Pills

Label with Dot

Developer Label

Build commerce faster with our headless e‑commerce engine