BASIC-LIBRARY / ATOM / BUTTON

LinkedIn Button

Preview

Code

Quick edit

@import url("/template/basic-library/atom/button/linkedin-button/raw/styles.css");

<button
  class="min-h-[44px] py-2 px-4 flex justify-center items-center bg-[#0a66c2] hover:contrast-[.9] text-white text-base font-semibold rounded-lg w-max h-max"
  ><div class="fill-current mr-2 -mt-1 w-[23px]"
    ><svg
      xmlns="http://www.w3.org/2000/svg"
      width="1em"
      height="1em"
      viewBox="0 0 24 24"
    >
      <path
        fill="currentColor"
        fill-rule="evenodd"
        d="M9.429 8.969h3.714v1.85c.535-1.064 1.907-2.02 3.968-2.02c3.951 0 4.889 2.118 4.889 6.004V22h-4v-6.312c0-2.213-.535-3.461-1.897-3.461c-1.889 0-2.674 1.345-2.674 3.46V22h-4zM2.57 21.83h4V8.799h-4zM7.143 4.55a2.53 2.53 0 0 1-.753 1.802a2.57 2.57 0 0 1-1.82.748a2.6 2.6 0 0 1-1.818-.747A2.55 2.55 0 0 1 2 4.55c0-.677.27-1.325.753-1.803A2.58 2.58 0 0 1 4.571 2c.682 0 1.336.269 1.819.747s.753 1.126.753 1.803"
        clip-rule="evenodd"
      ></path>
    </svg>
  </div>
  <span> Sign in with LinkedIn </span>
</button>

LinkedIn Button

Don’t Lose Your Edits!