@style Directive

TailUI adds a first-class escape hatch to Tailwind for scalable design systems — without runtime cost. Use the @style block to inject native CSS alongside @apply.

.ui-card {
  @apply rounded-lg border;
  @style {
    background: var(--ui-card-bg, white);
    transform: scale(var(--ui-card-scale, 1));
  }
}

The @style block is an escape hatch for advanced or dynamic CSS that utilities can't express. It is processed at build time and has zero runtime cost.