klickreflex/croissant

Maintainers

Details

github.com/klickreflex/croissant

Source

Issues

Installs: 5

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 0

Forks: 0

Open Issues: 0

pkg:composer/klickreflex/croissant

v1.0.9 2026-02-24 19:42 UTC

GPL-3.0-or-later cd2af97368799d621e32777d0afe9440a5962573

This package is auto-updated.

Last update: 2026-02-24 19:43:58 UTC

README

A CUBE CSS starter kit for Statamic, built on Peak foundations.

The name is a play on Peak — Gipfel in German — which also happens to be the German word for croissant.

What is this?

Croissant takes the excellent Peak starter kit by Rob de Kort and replaces its CSS architecture with the CUBE CSS methodology. Tailwind CSS 4 remains as the utility layer, but design decisions are driven by a token-based system with explicit compositions, blocks, and utilities.

The CUBE CSS integration is based on stvrhm/cube-boilerplate, itself a fork of Set Creative Studio's cube-boilerplate.

Key differences from Peak

  • Design token pipeline — JSON tokens for spacing, colors, typography, viewports. A build script generates Tailwind-compatible CSS custom properties.
  • Fluid type scale — Powered by Utopia, with steps from -3 to 8.
  • CUBE compositions — Flow, cluster, grid, sidebar, switcher, wrapper, repel, and fluid grid as reusable layout primitives.
  • Piccalilli reset — Replaces Tailwind's preflight with a modern, opinionated CSS reset.
  • CSS cascade layers — Explicit @layer ordering for theme, base, components, and utilities.
  • No @apply in CSS files — Compositions and blocks use vanilla CSS with custom properties.
  • Ejected vendor views — Peak Tools and Peak SEO views restyled to use the token system.

What's kept from Peak

  • Page builder blueprints and fieldsets
  • Alpine.js patterns (mobile nav, consent banner, toolbar)
  • SEO and tools addons (statamic-peak-seo, statamic-peak-tools)
  • Form handling, email templates, and content scaffold
  • SVG icon set

Installation

statamic new my-site klickreflex/croissant

After installation:

npm install
npm run dev

The Vite dev server automatically generates theme.css from your design tokens on startup and regenerates it whenever you change a token JSON file. A standalone npm run theme script is available for CI or one-off generation outside of Vite.

Credits

License

Croissant is licensed under the GNU General Public License v3.0. Statamic itself is commercial software and has its own license.