Content in Nuxt Application

Bitrix24 UI enriches Nuxt Content with elegant components and design.

Nuxt UI

Installation

To get started, you can follow the official guide or in summary:

pnpm

pnpm add @nuxt/content

yarn

yarn add @nuxt/content

npm

npm install @nuxt/content

bun

bun add @nuxt/content

Then, add the @nuxt/content module in your nuxt.config.ts:

nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    '@bitrix24/b24ui-nuxt',
    '@nuxt/content'
  ],
  css: ['~/assets/css/main.css']
})

DANGER

You need to register @nuxt/content after @bitrix24/b24ui-nuxt in the modules array, otherwise the prose components will not be available.

TIP

If your content includes Tailwind CSS classes, make sure to use the @source directive in your CSS file.

Typography

To make the most out of @nuxt/content we provide custom implementations of all prose components directly within Bitrix24 UI.

This gives us precise control over styling while ensuring perfect visual harmony with our design system.

TIP

Learn more about the Typography system and all the available components.