group & group-*: — Nakshora 3.1

VariantsNakshora 3.1Updated 2026-09-152 tags

Mark a parent `group`; children react to ITS state. Complete guide to these variants in Nakshora 3.1 with examples, stacking rules and pitfalls.

group & group-*: — Nakshora 3.1 — Nakshora Docs — Variants · Nakshora Docs editorial library

Mark a parent group; children react to ITS state.

Example#

html

<a class="group flex items-center gap-2">
  <span>Docs</span>
  <span class="opacity-0 group-hover:opacity-100 transition">→</span>
</a>

Stacking#

Prefix order is screens → variants → utility. These variants combine with every screen (xxs: xs: sm: md:…) and with each other.

Best practices#

Reveal-on-hover affordances
group-hover, group-focus, group-active, group-disabled, and named groups group/name

variants/index|Variants hub · responsive/index|Responsive · utilities/index|Utilities

#variants #group