Free Buttons HTML and CSS styles

        <a href="javascript:void(0)" class="whitegray">
  Find out more
</a>

<style>
  .whitegray {
    border-image: none 100% 1 0 stretch;
    border-radius: var(--bs-btn-border-radius);
    text-decoration: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    transition-behavior: normal, normal, normal, normal;
    --bs-btn-padding-x: 3rem;
    --bs-btn-padding-y: 0.75rem;
    --bs-btn-font-family: ;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 500;
    --bs-btn-line-height: 1.5;
    --bs-btn-border-radius: 6px;
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    border-style: solid;
    border-width: 2px;
    color: var(--bs-btn-color);
    cursor: pointer;
    display: inline-block;
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    text-align: center;
    user-select: none;
    vertical-align: middle;
  }

  @media (prefers-reduced-motion:reduce) {
    .whitegray {
      transition: none 0s;
      transition-behavior: normal;
    }
  }

  .whitegray:focus-visible {
    background-color: var(--bs-btn-hover-bg);
    border-color: #efefef;
    box-shadow: none;
    color: var(--bs-btn-hover-color);
  }

  .whitegray:first-child:active {
    background-color: var(--bs-btn-active-bg);
    border-color: #efefef;
    color: var(--bs-btn-active-color);
  }

  .whitegray:first-child:active:focus-visible {
    box-shadow: var(--bs-btn-focus-box-shadow);
  }

  .whitegray:disabled {
    background-color: var(--bs-btn-disabled-bg);
    border-color: #efefef;
    color: var(--bs-btn-disabled-color);
    opacity: var(--bs-btn-disabled-opacity);
    pointer-events: none;
  }

  .whitegray {
    --bs-btn-color: #000;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: rgb(203.15, 203.15, 203.15);
    --bs-btn-focus-shadow-rgb: 203, 203, 203;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: rgb(191.2, 191.2, 191.2);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #EFEFEF;
    background-color: #fff;
    border-color: #fff;
  }

  .whitegray:focus-visible, a.whitegray:focus-visible {
    outline: .25rem solid rgba(14, 19, 24, .5);
    outline-offset: 0;
  }

  .whitegray:focus, .whitegray:hover {
    color: #000;
  }

  .whitegray:focus {
    background-color: #efefef;
    border-color: #efefef;
  }

  .whitegray:hover {
    background-color: #efefef;
    border-color: #efefef;
  }
</style>
White Gray

Ask changes to AI:
