Free Buttons HTML and CSS styles

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

<style>
  .limepop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 99px;
    background-color: #d2e823;
    color: #1e2330;
    font-family: sans-serif;
    font-weight: bold;
    font-variation-settings: "wght" 500;
    font-size: 1.14vw;
    line-height: 100%;
    padding: 1.42vw 1.85vw 1.57vw;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.15s ease;
    cursor: pointer;
    border: none;
    width: fit-content;
  }

  .limepop:hover {
    background-color: #cee027;
  }

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

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

  @media screen and (min-width: 1920px) {
    .limepop {
      padding: 24px 31.2px 26.4px;
    }
  }

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

  @media screen and (max-width: 479px) {
    .limepop {
      font-size: 4vw;
      font-weight: 400;
      line-height: 120%;
      padding: 6.3vw 7vw;
    }
  }
</style>
Lime Pop

Ask changes to AI:
