<a href="#" class="ctc-pixel">RETRO</a>

.ctc-pixel {
  display: inline-flex;
  align-items: center;
  padding: 9px 18px;
  border: 2px solid #f5a84a;
  border-radius: 4px;
  background-color: #1a1410;
  background-image: radial-gradient(#f5a84a 1px, transparent 1px);
  background-size: 8px 8px;
  color: #f5a84a;
  font:
    700 12px/1 ui-monospace,
    monospace;
  letter-spacing: 0.14em;
  text-decoration: none;
  transition:
    background-size 0.4s ease,
    color 0.2s ease,
    border-color 0.2s ease;
}

.ctc-pixel:hover {
  background-size: 4px 4px;
  color: #ffd479;
  border-color: #ffd479;
}