Divide Color

Use divide-{color}-{shade} to set the color of dividers added by divide-x / divide-y.

Divider between children

Use utilities like divide-indigo-500 and divide-lime-100 to control the border color between child elements:

Style('grid grid-cols-3 divide-x-4 divide-indigo-500', children: [
  Text('01'),
  Text('02'),
  Text('03'),
])

When divide-{color} is unset, dividers default to gray-200 (#E5E7EB).

Class reference

divide-{color}-{shade} accepts the full Tailwind color palette, with shades 50, 100, 200, …, 950, plus the named values inherit, current, transparent, black, white. Common examples:

Class	Color
divide-gray-200	Default divider gray
divide-indigo-500	Brand indigo
divide-blue-500	Blue
divide-red-500	Red
divide-green-500	Green
divide-{color}/<N>	Color with <N>% opacity (e.g. divide-indigo-500/50)

Pair with divide-width to control the line thickness.