Free Buttons HTML and CSS styles

        <a href="javascript:void(0)" class="rosyglow">
  Get started for free
</a>

<style>
  .rosyglow {
    margin: 0 auto;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 99px;
    background-color: #e9c0e9;
    color: #000;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 1.14vw;
    line-height: 100%;
    padding: 1.42vw 1.85vw 1.57vw;
    min-height: 4.64vw;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.15s ease;
    cursor: pointer;
  }

  .rosyglow:hover {
    background-color: #de9fde;
  }

  @media screen and (min-width: 1280px) {
    .rosyglow {
      font-size: 14.5px;
      padding: 18.18px 23.63px 20px;
    }
  }

  @media screen and (min-width: 1440px) {
    .rosyglow {
      font-size: 16px;
      padding: 20px 26px 22px;
      min-height: 65.03px;
    }
  }

  @media screen and (max-width: 991px) {
    .rosyglow {
      font-size: 1.7vw;
      padding: 1.704vw 2.22vw 1.9vw;
      min-height: 5.56vw;
    }
  }

  @media screen and (max-width: 767px) {
    .rosyglow {
      font-size: 1.7vw;
    }
  }

  @media screen and (max-width: 479px) {
    .rosyglow {
      font-size: 4vw;
      font-weight: 400;
      line-height: 120%;
      padding: 6.3vw 7vw;
      min-height: 13.8vw;
      text-align: center;
    }
  }
</style>
Rosy Glow

Ask changes to AI:
