Home /

docs

Concrete Theme

A louder brutalist-style preset with poster typography, offset shadows, square corners, and bold contrast.

Usage

docs.config.ts
import { defineDocs } from "@farming-labs/docs";
import { concrete } from "@farming-labs/theme/concrete";

export default defineDocs({
  entry: "docs",
  theme: concrete(),
});
app/global.css
@import "tailwindcss";
@import "@farming-labs/theme/concrete/css";

Defaults

PropertyValue
Primary#ff5b31
Background#f6ead9 (light), #12100f (dark)
Border radius0px
Content width896px
Sidebar width316px

Customizing

customizing.tsx
theme: concrete({
  ui: {
    colors: { primary: "#ff7848" },
    layout: { sidebarWidth: 332 },
  },
}),