Vertical Text Bootstrap

vertical_text.html

<div class="flex m-20">
  <div class="px-2 py-2 flex inset-0 border-l border-t border-b rounded-tl rounded-bl bg-blue-400 border-blue-700"
  style="background-color: rgb(0, 83, 135)"
  >
    <div class="inset-0 transform rotate-180 self-center font-semibold uppercase text-2xl text-gray-100" style="writing-mode: vertical-rl; text-orientation: sideways">
      Non Gradient

      <span class="bg-clip-text text-transparent bg-gradient-to-r from-white to-gray-50">
        /w Gradient
      </span>
    </div>
  </div>
  <div class="p-5 border rounded-tr rounded-br border-blue-700">
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Id consequuntur odit molestiae reiciendis, aut alias pariatur quidem eius magni nostrum commodi repudiandae laudantium molestias explicabo temporibus? Voluptatem ullam quis totam.
   sum dolor sit amet consectetur adipisicing elit. Id consequuntur odit molestiae reiciendis, aut alias pariatur quidem eius magni nostrum commodi repudiandae laudantium molestias explicabo temporibus? Voluptatem ullam quis totam.
    </div>
</div>