button {
        color: #FFB7C5;
        transition: 0.25s;
        &:focus { 
          border-color: #EF98AA;
          color: #fff;
      .pulse:focus {
        animation: pulse 1s;
        box-shadow: 0 0 0 2em transparent;
      @keyframes pulse {
        0% { box-shadow: 0 0 0 0 #EF98AA; }

      Css language logo

      Custom Buttons in CSS

      The code creates a button that has a red border when it is not being hovered over or focused on, and a green border when it is being hovered over or focused on. The border color will change depending on whether the button is in the "pulse" state or not.

      Shortcut: btn.pulse


        Add Comment

        Log in to add a comment

        Codiga - All rights reserved 2022.