Link

# Basics

To create a stylized link, you can use the moonshine::link-button components or moonshine::link-native.

<x-moonshine::link-button href="#">Link</x-moonshine::link-button>
 
<x-moonshine::link-native href="#">Link</x-moonshine::link-native>

<x-moonshine::link-button href="#">Link</x-moonshine::link-button>

<x-moonshine::link-native href="#">Link</x-moonshine::link-native>

Link Link

# Fill

The filled parameter is responsible for filling.

<x-moonshine::link-button
    href="#"
    :filled="true"
>
    Link
</x-moonshine::link-button>
 
<x-moonshine::link-native
    href="#"
    :filled="true"
>
    Link
</x-moonshine::link-native>

<x-moonshine::link-button
    href="#"
    :filled="true"
>
    Link
</x-moonshine::link-button>

<x-moonshine::link-native
    href="#"
    :filled="true"
>
    Link
</x-moonshine::link-native>

Link Link

# Icon

You can pass the icon parameter.

<x-moonshine::link-button
    href="#"
    icon="heroicons.arrow-top-right-on-square"
>
    Link
</x-moonshine::link-button>
 
<x-moonshine::link-native
    href="#"
    icon="heroicons.arrow-top-right-on-square"
>
    Link
</x-moonshine::link-native>

<x-moonshine::link-button
    href="#"
    icon="heroicons.arrow-top-right-on-square"
>
    Link
</x-moonshine::link-button>

<x-moonshine::link-native
    href="#"
    icon="heroicons.arrow-top-right-on-square"
>
    Link
</x-moonshine::link-native>

Link Link

All available icons .