# UIKIT - Button & LoadingButton

**URL:** <https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127>\
**Category:** Forge UI Kit and Custom UI\
**Tags:** forge-ui-kit-2\
**Created:** [January 23, 2025, 1:43pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127 "2025-01-23T13:43:00Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![GuillaumeBero](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/guillaumebero/32/50913_2.png) [@GuillaumeBero](https://community.developer.atlassian.com/u/GuillaumeBero)\
**Post date:** [January 23, 2025, 1:43pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/1 "2025-01-23T13:43:00Z")

</div>

The buttons height are different between a `Button` and a `LoadingButton`

Is this expected ? From the documentation it doesn’t look like it.

```auto
const App = () => {
  return (
    <Inline space='space.300'>
      <Button
        appearance='primary' onClick={() => {
        }}
      >Button</Button>
      <LoadingButton
        appearance='primary' onClick={() => {
        }}
      >Loading Button</LoadingButton>

    </Inline>
  )
}

```

 ![Screenshot 2025-01-23 at 14.42.12](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/4/e/4e29188ff5cf7221aac271c6f21ae2b1400a4b60.png)

Also side question : Is it possible to define a different button height ?  
I gave it a try with wrapping the content in a Box with a xcss height but that didn’t work. It looks like it’s fixed.

---

<div class="post-metadata">

**Author:** ![AaronCollier](https://avatars.discourse-cdn.com/v4/letter/a/e274bd/32.png) [@AaronCollier](https://community.developer.atlassian.com/u/AaronCollier)\
**Post date:** [January 24, 2025, 2:13pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/2 "2025-01-24T14:13:11Z")

</div>

When I use that code, my buttons are the same height. Maybe depends on the context. You can make buttons smaller by setting `spacing` to `compact`.

---

<div class="post-metadata">

**Author:** ![GuillaumeBero](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/guillaumebero/32/50913_2.png) [@GuillaumeBero](https://community.developer.atlassian.com/u/GuillaumeBero)\
**Post date:** [January 24, 2025, 3:51pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/3 "2025-01-24T15:51:01Z")

</div>

in UIKIT2 ? (@forge/react 10)

---

<div class="post-metadata">

**Author:** ![AaronCollier](https://avatars.discourse-cdn.com/v4/letter/a/e274bd/32.png) [@AaronCollier](https://community.developer.atlassian.com/u/AaronCollier)\
**Post date:** [January 24, 2025, 4:57pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/4 "2025-01-24T16:57:20Z")

</div>

It’s called UI Kit now. The old version is UI Kit 1 and the new one is UI Kit. It is rather confusing. But yes, I was using `@forge/react` 10.

---

<div class="post-metadata">

**Author:** ![GuillaumeBero](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/guillaumebero/32/50913_2.png) [@GuillaumeBero](https://community.developer.atlassian.com/u/GuillaumeBero)\
**Post date:** [January 24, 2025, 9:13pm UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/5 "2025-01-24T21:13:09Z")

</div>

Can you give it a shot on a confluence page? I guess you tried on a jira module?

---

<div class="post-metadata">

**Author:** ![AaronCollier](https://avatars.discourse-cdn.com/v4/letter/a/e274bd/32.png) [@AaronCollier](https://community.developer.atlassian.com/u/AaronCollier)\
**Post date:** [January 27, 2025, 10:51am UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/6 "2025-01-27T10:51:47Z")

</div>

I tried it in a Confluence macro or custom macro config.

---

<div class="post-metadata">

**Author:** ![GuillaumeBero](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/guillaumebero/32/50913_2.png) [@GuillaumeBero](https://community.developer.atlassian.com/u/GuillaumeBero)\
**Post date:** [January 28, 2025, 8:18am UTC](https://community.developer.atlassian.com/t/uikit-button-loadingbutton/88127/7 "2025-01-28T08:18:23Z")

</div>

Not sure why it’s still wrong on my end.  
Debugging it with an Atlassian through a support request.  
Will keep posted.