TLDR Design · MISCELLANEOUS

TRANSPARENT BORDERS

bradfrost.com2 min read

Summary from the TLDR Design newsletter

Removing borders with CSS can pose accessibility issues, especially in high contrast mode. Setting border color: transparency enables changing border color without affecting the box model. It is helpful for hover effects without layout alterations. This approach also aids in themeable design systems by offering flexibility for various brands and themes, reducing misalignment and unexpected behavior caused by different border widths, and minimizing QA efforts.