N
Nuxt•4w ago
hiimmox

How to change the loading icon size in Nuxt UI button?

It seems to be hardcoded to "size-5"
4 Replies
kapa.ai
kapa.ai•4w ago
Hi @hiimmox. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the available knowledge sources, there is no explicit documentation or prop for directly changing the loading icon size in the Nuxt UI Button component. The documentation shows how to customize the loading icon itself using the loading-icon prop, but it does not mention a way to adjust its size via a prop or slot. The icon size appears to be set by internal classes, and there is no mention of a dedicated API for overriding this size in the Button component documentation or theming examples Button Loading Icon. If you need to change the icon size, you may need to use custom CSS targeting the loading icon, but this approach is not covered in the official documentation. If you require a supported solution, consider submitting a feature request or checking for updates in the official Nuxt UI documentation. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•4w ago
<@327193365797928963> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
dwol
dwol•4w ago
maybe try the 'leading' slot default size is medium, you can edit it in the theme here 
md: {
            base: 'px-2.5 py-1.5 text-sm gap-1.5',
            leadingIcon: 'size-5',
            leadingAvatarSize: '2xs',
            trailingIcon: 'size-5'
          },
md: {
            base: 'px-2.5 py-1.5 text-sm gap-1.5',
            leadingIcon: 'size-5',
            leadingAvatarSize: '2xs',
            trailingIcon: 'size-5'
          },
hiimmox
hiimmoxOP•4w ago

Did you find this page helpful?