Link

You're browsing the documentation for an old version of MoonShine. Consider upgrading your project to MoonShine 2.x.

Sections
- Basics
- Filled
- Icon

# Basics

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

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

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

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

Link Link

# Filled

The filled parameter is responsible for filling

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

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

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

Link Link

# Icon

You can pass the parameter icon

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

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

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

Link Link