BOUTON

1,761 mambetov1237.b

Ouvrir dans l'éditeur Publiez votre code

Recommandé

20 October 2024

Bouton de dégradé CSS

23 November 2025

Bouton Firefly HTML CSS Tailwind

22 November 2025

Effet de survol du bouton en verre liquide CSS

HTML

CSS

body {
  background-color: darkslategray;
  display: flex;
}
.btn {
  display: grid;
  margin: 100px 20px;
  font-size: 4.2rem;
  padding: 1rem 2.5rem;
  border: none;
  outline: none;
  border-radius: 0.4rem;
  cursor: pointer;
  text-transform: uppercase;
  background-color: rgb(14, 14, 26);
  color: rgb(234, 234, 234);
  font-weight: 700;
  transition: 0.6s;
  box-shadow: 0px 0px 60px #1f4c65;
  -webkit-box-reflect: below 10px
    linear-gredient(to bottom, rgba(0, 0, 0, 0, 0), rgba(0, 0, 0, 0, 4));
}
.btn:active {
  scale: 0.92;
}
.btn2:hover {
  background: rgb(2, 29, 78);
  background: linear-gradient(270deg, #009245 0%, #fcee21 60%);
  color: rgb(4, 4, 38);
}
.btn1:hover {
  background: rgb(2, 29, 78);
  background: linear-gradient(270deg, #6d214f 0%, #18dcff 60%);
  color: rgb(4, 4, 38);
}
.btn3:hover {
  background: rgb(2, 29, 78);
  background: linear-gradient(270deg, #d4145a 0%, #fbb03b 60%);
  color: rgb(4, 4, 38);
}