flowbite-vue/docs/components/link.md

<script setup> import FwbAExample from './typography/link/FwbAExample.vue' import FwbAExampleParagraph from './typography/link/FwbAExampleParagraph.vue' import FwbAExampleCustom from './typography/link/FwbAExampleCustom.vue' </script>

Vue Links - Flowbite

The link component can be used to set hyperlinks from one page to another or to an external website when clicking on an inline text item, button, or card

Default link

Use this example to set default styles to an inline link element.

<template>
  <fwb-a href="#"> Flowbite-vue </fwb-a>
</template>

<script setup>
import { FwbA } from 'flowbite-vue'
</script>

Paragraph link

Use this example to set a link inside a paragraph with an underline style.

<template>
  <fwb-p>
    The free updates that will be provided is based on the <fwb-a href="#"
    class="underline hover:no-underline">roadmap</fwb-a> that we have laid
    out for this project. It is also possible that we will provide
    extra updates outside of the roadmap as well.
  </fwb-p>
</template>

<script setup>
import { FwbA, FwbP } from 'flowbite-vue'
</script>

Custom classes

Use class attribute prop to apply the tailwind classes.

<template>
  <fwb-a class="text-orange-500 italic" href="#"> Flowbite-vue </fwb-a>
</template>

<script setup>
import { FwbA } from 'flowbite-vue'
</script>