Welcome to Colourly

Explore a curated set of components and patterns. Use the sticky navigation above to discover sections.

View Features See Examples

Features

Responsive

Built with mobile-first responsive primitives.

Accessible

Uses Radix UI under the hood for a11y.

Themeable

Dark mode tokens and customizable themes.

Typed

TypeScript across components and utilities.

Composable

Small, composable building blocks.

Modern

Next.js App Router, React Server Components.

Examples

Scroll the page to verify the navigation stays fixed at the top. This section is intentionally longer to create enough scrollable content.

Example Block 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 7

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.

Example Block 8

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.