014: Tailwind CSS

A Piko project using Tailwind CSS for styling. The example shows how to use Tailwind's utility classes directly in .pk markup class attributes and load the generated stylesheet via a single @import inside a <style global> block in a shared layout partial.

What this demonstrates

  • Applying Tailwind utility classes directly in .pk markup, with the generated stylesheet imported once via an @import inside a <style global> block in a shared layout partial.
  • A shared lib/ folder for common styling utilities.
  • Piko's CSS reset working alongside Tailwind.

Project structure

src/
  cmd/main/main.go      Bootstrap with WithCSSReset and dev-mode options.
  pages/                Pages using Tailwind utilities.
  partials/             Shared partials.
  lib/                  Shared styling helpers.

How to run this example

From the Piko repository root:

cd examples/scenarios/014_tailwind_css/src/
go mod tidy
air

See also