cg738yzcuvr3p5x
CSS Snippet

Dec 18, 2023

 /* Stripe like button */

.button-primary {

  padding: 1rem 2rem;
 
  font-size: 1rem;

  font-weight: 600;

  color: white;

  background-color: #1F2937;
 
  border: none;

  border-radius: 0.375rem;

  cursor: pointer;

  transition: background-color 0.3s, box-shadow 0.3s, transform 0.3s;

  outline: none;

  user-select: none;

  -webkit-user-select: none;

  touch-action: manipulation;

}



.button-primary:hover {

  background-color: #4F46E5;

  box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.1), 0 4px 6px -2px rgba(79, 70, 229, 0.05);

}



.button-primary:focus {

  box-shadow: 0 0 0 3px rgba(164, 202, 254, 0.45);

  transform: translateY(-2px);

}