Changelog

Detector

background-clip: text gradients stop tripping the contrast rules when the glyph fill is transparent.

What the rule catches

.hero-title {
  background: linear-gradient(135deg, #667eea, #764ba2);
  -webkit-background-clip: text;
  background-clip: text;
  color: #7c3aed;
}

The Tailwind form pairs bg-clip-text with bg-gradient-to-r on one element; the two utilities together are the tell.

Pulsing dots

.status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  animation: pulse 2s ease-in-out infinite;
}

Side stripes

.card::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  background: #3b82f6;
}