Back to CSS Floating Buttons Neon Cyber Pure CSS
Share
.cfb-neon {
  width: 56px; height: 56px;
  border: 1.5px solid #6cffff;
  border-radius: 50%;
  background: rgba(10,0,20,0.85);
  color: #6cffff;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 12px rgba(108,255,255,0.4), inset 0 0 8px rgba(108,255,255,0.15);
  transition: box-shadow 0.25s, color 0.25s, border-color 0.25s, transform 0.2s;
}
.cfb-neon:hover {
  border-color: #ff6cff;
  color: #ff6cff;
  box-shadow: 0 0 24px rgba(255,108,255,0.7), 0 0 48px rgba(255,108,255,0.3), inset 0 0 12px rgba(255,108,255,0.2);
  transform: scale(1.05);
}
.cfb-neon:focus-visible { outline: 2px solid #ff6cff; outline-offset: 4px; }
.cfb-neon svg { width: 22px; height: 22px; fill: currentColor; stroke: currentColor; stroke-width: 1; stroke-linejoin: round; }
<button type="button" class="cfb-neon" aria-label="Execute">
  <svg viewBox="0 0 24 24" aria-hidden="true"><polygon points="6 4 20 12 6 20 6 4" /></svg>
</button>
Live preview Edit any tab — preview updates live Ready