Skip to content

@stillwind-undef-utility

Remove built-in or plugin utility definitions that match a name or a prefix.

@stillwind-undef-utility name;
@stillwind-undef-utility prefix-*;
@stillwind-undef-utility *;

@stillwind-undef-utility removes the matching utility definitions that register before it. A removed utility becomes unknown, and unknown-utility reports its uses. Write it at the top level of the stylesheet or in a @stillwind-registry block.

Example

Stylesheet

@stillwind-undef-utility float-*;

@utility float-start {
  float: inline-start;
}

Source

import { style } from "stillwind/react";

export const removed = style("float-left");
export const replaced = style("float-start");

Compiled code

export const removed = {};
export const replaced = {className:"sw_vofby"};

Generated stylesheet without preflight

/*! stillwind v0.0.0 | MIT License | https://stillwind.dev */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties, theme, base, components, utilities;

@layer utilities {
  .sw_vofby {
    float: inline-start;
  }
}

The statement removes every built-in float-* utility. float-left produces no class, and float-start uses only the new definition.

Patterns

A pattern is *, an exact name, or a prefix followed by *. duration-* matches the definition duration-* and the exact names that start with duration-, such as duration-initial. It does not match -duration-*: a pattern for negative names starts with -.

Order

The statements that @plugin generates register first. The other statements, including the built-in definitions that @import "stillwind" loads, follow in source order. An undefinition removes only definitions that register before it:

  • It removes plugin utilities, wherever the @plugin statement stands.
  • It removes the built-in utilities that @import "stillwind" loads before it.
  • It does not remove a @utility that comes after it, so you can remove a built-in utility and define your own utility with the same name.

A replacement with the same name keeps the cascade position of the removed definition, so it wins against the same utilities as before. A definition with another name takes the position where you write it. A definition without * does not take the position of a removed prefix-* definition. The logical stylesheets replace utilities in this way.

Outside a block, the statement changes the default, keyframe, and view-transition registries.

To report uses of a utility without removing it, use no-restricted-utilities instead.