CSS knapp generator

CSS knapp generator gratis online. Bearbeta data direkt i din webbläsare. Ingen uppladdning, ingen registrering, helt privat.

Lokal bearbetning

Background (solid)

Text color

Shadow color

Use gradient background

Gradient start

Gradient end

Gradient angle: 135°

Border radius: 8px

Padding X: 20px

Padding Y: 10px

Font size: 16px

Shadow X: 0px

Shadow Y: 4px

Shadow blur: 6px

Hover lift: 2px

Preview

.btn {
  background: linear-gradient(135deg, #6366f1, #ec4899);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 10px 20px;
  font-size: 16px;
  font-weight: 600;
  box-shadow: 0px 4px 6px #00000040;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0px 6px 10px #00000040;
}

Hur man använder

Ange din input ovan. Resultatet uppdateras automatiskt. Använd kopieringsknappen för att kopiera resultatet.

Privatliv

All bearbetning sker i din webbläsare. Din data laddas aldrig upp till någon server.

FAQ

Är denna CSS knapp generator gratis?

Ja, helt gratis. Ingen registrering krävs.

Laddar detta verktyg upp min data?

Nej. All bearbetning sker lokalt i din webbläsare. Din data lämnar aldrig din enhet.

CSS knapp generator