Feature spotlight section — Nakshora 1.0 Cookbook

CookbookNakshora 1.0Updated 2026-09-152 tags

Large alternating rows. The Nakshora 1.0 solution with code, explanation and variants.

Feature spotlight section — Nakshora 1.0 Cookbook — Nakshora Docs — Cookbook · Nakshora Docs editorial library

Problem: Large alternating rows.

Solution#

html

<section class="grid items-center gap-12 py-20 lg:grid-cols-2">
  <div class="order-2 lg:order-1">image</div>
  <div class="order-1 lg:order-2"><p class="text-sm font-semibold text-blue-600">Kicker</p><h2 class="mt-2 text-3xl font-bold">Benefit</h2><p class="mt-4 text-slate-600">Proof…</p></div>
</section>

Why this works#

Alternating order classes flip rows per section.

Variants#

Responsive: add screen prefixes to the core classes
Dark: pair each color utility with its dark: twin
Animated: add transition + a state variant for motion

cookbook/index|Cookbook index · utilities/index|Utilities reference · patterns/index|Layout patterns

#cookbook #recipes