border-<palette>-<shade>, divide-*, ring-* colors.

Syntax#

html
<div class="border border-slate-200 dark:border-slate-700">Adaptive</div>

All palettes apply#

Every palette in the colors/index|color system generates a border-* class: border-neon-purple-500, border-neon-pink-500, border-neon-cyan-500, border-neon-lime-500, border-neon-orange-500, border-pastel-rose-500, border-pastel-lavender-500, border-pastel-mint-500…

Patterns#

  • Hairlines: border-slate-200 dark:border-slate-800
  • Focus: ring-2 ring-blue-500
  • Dividers: divide-y divide-slate-100

colors/index|Color hub · concepts/dark-mode-strategies|Dark mode · accessibility/color-contrast|Contrast