CSS custom properties with var() can be confusing due to fallback behaviors. When var(--color, blue) is used, if --color is invalid, it defaults to blue, but if it’s valid and holds an invalid value, like notacolor, the fallback isn't applied, resulting in default text color (usually black). To ensure fallbacks work, consider using registered properties with initial values or @supports to define valid states before using custom properties. Future CSS developments may also enhance fallback functionality.
Custom Property Fallbacks
