The admin panel your Convex app deserves.

A metadata-driven CMS framework for Astro + Convex. Type-safe field builders, rich text editing, and automatic UI generation.

Get started View on GitHub
vextro.config.ts
convex/schema.ts 
import { defineVextroConfig, f } from 'vextro'

export default defineVextroConfig({
  collections: {
    pages: {
      label: 'Pages',
      fields: {
        title: f.text({ required: true }),
        slug: f.slug({ from: 'title' }),
        content: f.richText(),
        status: f.select({
          options: ['draft', 'published'],
          defaultValue: 'draft',
        }),
      },
    },
  },
})

Getting started

Vextro is a metadata-driven CMS admin framework for Astro + Convex that generates beautiful, full-featured admin panels from your schema definitions.

Installation

Step-by-step guide to getting Vextro set up in your Convex project.

Fields

Explore all field types from text and select to rich text, blocks, and custom fields.

Collections

Define your content collections with typed schemas, indexes, and admin configuration.

Theming

Customize the admin panel appearance with semantic tokens and dark mode support.

Quick start

Install the package

npm install vextro

Initialize your project

npx vextro-init

This scaffolds the necessary Convex functions and Astro pages for your admin panel. See the installation guide for detailed instructions.

Core concepts

Vextro reads your Convex schema metadata to dynamically generate admin interfaces. You define your content model using type-safe field builders, and Vextro handles the rest — list views, document editing, validation, and more.

Field builders

The f namespace provides type-safe field builders for every supported data type. Each builder produces a VextroFieldDefinition that includes both a Convex validator and admin UI configuration.

Collections and globals

Collections represent repeating content types (pages, posts, products), while globals represent singleton data (site settings, navigation). Both are defined in your Vextro config and automatically generate admin interfaces.

Layout fields

Layout fields like tabs, row, and collapsible let you organize your admin forms without affecting the data model.