Skip to content

[APM] Improve contrast of health badges in service inventory#250850

Merged
AlejandroFrndz merged 1 commit intoelastic:mainfrom
AlejandroFrndz:5157-improve-health-badge-contrast-in-service-inventory
Jan 29, 2026
Merged

[APM] Improve contrast of health badges in service inventory#250850
AlejandroFrndz merged 1 commit intoelastic:mainfrom
AlejandroFrndz:5157-improve-health-badge-contrast-in-service-inventory

Conversation

@AlejandroFrndz
Copy link
Copy Markdown
Contributor

Summary

Health badges in the service inventory table have weak contrast between text and background. Instead of leveraging standard named colours for the health badges, we're passing euiTheme colours straight as HEX values. While this might seem equivalent at a glance, badges work differently visually with named colours than they do with HEX values.

In order to improve the contrast between text and background in the badge and to visually standardize health with other badges in the table (alerts & SLOs) this PR updates health badges to use named colours instead.

UI Updates

Before

Before

After

After

@AlejandroFrndz AlejandroFrndz self-assigned this Jan 29, 2026
@AlejandroFrndz AlejandroFrndz requested a review from a team as a code owner January 29, 2026 08:51
@AlejandroFrndz AlejandroFrndz added release_note:skip Skip the PR/issue when compiling release notes backport:skip This PR does not require backporting Team:obs-presentation Focus: APM UI, Infra UI, Hosts UI, Universal Profiling, Obs Overview and left Navigation labels Jan 29, 2026
@elasticmachine
Copy link
Copy Markdown
Contributor

Pinging @elastic/obs-presentation-team (Team:obs-presentation)

Copy link
Copy Markdown
Contributor

@rmyz rmyz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@AlejandroFrndz AlejandroFrndz enabled auto-merge (squash) January 29, 2026 08:53
@AlejandroFrndz AlejandroFrndz merged commit f2141aa into elastic:main Jan 29, 2026
24 checks passed
@elasticmachine
Copy link
Copy Markdown
Contributor

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

  • [job] [logs] FTR Configs #121 / Entity Analytics - Privilege Monitoring @ess @serverless @skipInServerlessMKI Entity Privilege Monitoring Engine Plain Index Sync Plain index sync should not create duplicate users

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
apm 3.1MB 3.1MB -103.0B

cc @AlejandroFrndz

hannahbrooks pushed a commit to hannahbrooks/kibana that referenced this pull request Jan 30, 2026
…#250850)

## Summary

Health badges in the service inventory table have weak contrast between
text and background. Instead of leveraging standard named colours for
the health badges, we're passing `euiTheme` colours straight as HEX
values. While this might seem equivalent at a glance, badges work
differently visually with named colours than they do with HEX values.

In order to improve the contrast between text and background in the
badge and to visually standardize health with other badges in the table
(alerts & SLOs) this PR updates health badges to use named colours
instead.

## UI Updates

### Before

<img width="1589" height="200" alt="Before"
src="https://github.com/user-attachments/assets/7ae9fa8d-7c1d-4d0b-9d10-f2b36de506eb"
/>

### After

<img width="1584" height="202" alt="After"
src="https://github.com/user-attachments/assets/513f0f3c-77a0-4c13-ab17-d2d646530e47"
/>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport:skip This PR does not require backporting release_note:skip Skip the PR/issue when compiling release notes Team:obs-presentation Focus: APM UI, Infra UI, Hosts UI, Universal Profiling, Obs Overview and left Navigation v9.4.0

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants