Svelte + Nakshora 3.1

Class: directives plus utilities — best friends.

Conditional classes#

<script>
  let active = false;
</script>

<button
  class:active
  class="px-4 py-2 rounded-lg transition"
  class:bg-blue-500={active}
>Toggle</button>

Patterns that scale#

• class: directives compose perfectly with utilities
• Keep component APIs as variant props mapping to class sets

Gotchas#

• class:{expr} is fine; runtime-built strings are not scanned