Draft: feat(GlButton): Update design
What does this MR do and why?
Modernizes the default button style for a cleaner, more up-to-date appearance.
This update brings subtle yet meaningful improvements to enhance visual clarity and align with evolving UI standards. While increasing the border radius is currently out of scope, this change sets the foundation for future enhancements, including the introduction of semantic design tokens for border radius treatments.
Key adjustments
- Applies a filled background using
neutral.10
, giving the button a more solid and intentional presence (and visually further distinguish it from form fields) - Reduces the font size to
13px
for better typographic balance across components - Bumps font weight to
500
to improve text legibility and emphasis while decreasing font size
Screenshots or screen recordings
Before | After |
---|---|
![]() |
![]() |
![]() |
![]() |
Disabled | |
![]() |
![]() |
How to set up and validate locally
- http://localhost:9001/?path=/story/base-button--all-variants-and-categories
- http://localhost:9001/?path=/story/base-button-group--all-split-dropdowns-variants
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to gitlab-org/gitlab#513105 (closed), #2945
Edited by Sascha Eggenberger