EditNext

<button
  class="px-4 py-2 bg-green-500 hover:bg-green-400 rounded-md shadow-md hover:shadow-lg active:shadow text-white tracking-wide font-medium transform hover:-translate-y-1 transition-all ease-in-out duration-300 active:translate-y-px focus:outline-none"
>
  Button
</button>

<div class="px-6 py-4 bg-gray-400 w-full">
  <div class="flex items-center justify-between mx-auto md:max-w-2xl lg:max-w-4xl xl:max-w-6xl">
    <div class="flex items-center">
      <img src="/editnext.svg" alt="EditNext logo" class="h-10" />
      <p class="ml-4 text-xl font-medium whitespace-no-wrap">Project name</p>
    </div>
    <div class="hidden md:flex items-center space-x-6">
      <a class="font-medium text-gray-700 hover:text-gray-900" href="#">About</a>
      <a class="font-medium text-gray-700 hover:text-gray-900" href="#">Home</a>
      <a class="font-medium text-gray-700 hover:text-gray-900" href="#">Help</a>
      <a class="font-medium text-gray-700 hover:text-gray-900" href="#">Account</a>
      <a class="font-medium text-gray-700 hover:text-gray-900" href="#">Billing</a>
    </div>
  </div>
</div>

<p class="ml-4 text-sm font-semibold tracking-wider text-white px-3 py-1 bg-blue-600 rounded-full transform scale-90">
  Scaled down badge
</p>