Skip to content

Inset Ring Color

Use inset-ring-{color} utilities like inset-ring-blue-500 to set the inset ring color. Supports the full Tailwind palette, opacity modifiers (/50), and special keywords (inset-ring-current, inset-ring-inherit, inset-ring-transparent).

Style('inset-ring-2 inset-ring-blue-500 ...', child: Text('Subscribe'))
Style('inset-ring-2 inset-ring-blue-500/50 ...', child: Text('Subscribe'))

By default inset rings have an opacity of 100%; use the opacity modifier to adjust.

ClassDescription
inset-ring-inheritInherits ring color (approximated as currentColor in Flutter)
inset-ring-currentUses the current text color (DefaultTextStyle)
inset-ring-transparentTransparent inset ring
inset-ring-{color}-{shade}Full Tailwind palette, e.g. inset-ring-blue-500
inset-ring-{color}-{shade}/{opacity}With opacity modifier, e.g. inset-ring-blue-500/50