Link

<div class="flex flex-col gap-3">
    <div>
        <a href="#" class="text-fg hover-text-fg-title underline">
            Profile Page
        </a>
    </div>
    <div>
        <a href="#" class="text-bfg hover-text-fg-title underline underline-offset-2">
            Undeline Offset
        </a>
    </div>
    <div>
        <a href="#"  class="text-success600 dark-text-success500 hover-text-fg-title underline underline-offset-2 decoration-success-600 dark:decoration-success-500 hover:decoration-gray-900 dark:hover:decoration-white">
            Undeline colored
        </a>
    </div>
</div>

<div class="flex flex-col gap-3">
    <div>
        <a href="#" class="text-fg hover-text-title underline flex items-center gap-x-2.5">
            <span aria-hidden="true" class="flex i-ph-caret-left text-sm"></span>
            Go Back
        </a>
    </div>
    <div>
        <a href="#" class="text-fg hover-text-fg-title underline underline-offset-2 flex items-center gap-x-2.5">
            <span aria-hidden="true" class="flex i-ph-caret-left text-sm"></span>
            Back To Profile
        </a>
    </div>
    <div>
        <a href="#" class="text-success-600 dark-text-success-500 hover-text-fg-title  flex items-center gap-x-2.5">
            <span aria-hidden="true" class="flex i-ph-house-line text-sm"></span>
            Home Page
        </a>
    </div>
</div>

<div class="flex flex-wrap gap-3">
    <a href="#" class="btn btn-md btn-solid btn-solid-neutral text-bg rd-md transition-colors ease-linear">
        Click me
    </a>
    <a href="#" class="btn btn-md gap-x-2.5 rd-md btn-soft btn-soft-gray">
        Click me
        <span aria-hidden="true" class="flex i-ph-caret-right text-sm"></span>
    </a>
</div>