Skip to content

Improve docs from user feedback: clarify run color settings navigation #2934

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mintlify wants to merge 7 commits into
base: main
Choose a base branch
from
Open

Improve docs from user feedback: clarify run color settings navigation #2934

Changes from 4 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d04ace6
docs: clarify workspace path to key-based run color settings and buckets
mintlify[bot] Jul 20, 2026
419583b
docs: fix duplicate word in intro sentence
mintlify[bot] Jul 20, 2026
64f7676
Merge branch 'main' into mintlify/c7f6bef2
johndmulhausen Jul 22, 2026
d73a138
style: apply Google Developer Style Guide passes to color-code-runs
johndmulhausen Jul 22, 2026
0e6f3ed
Update models/runs/color-code-runs.mdx
johndmulhausen Jul 24, 2026
cab2838
docs: clarify prerequisites for key-based run colors
johndmulhausen Jul 24, 2026
3b32ceb
docs: describe both key-color paths in Customize buckets
johndmulhausen Jul 24, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 21 additions & 12 deletions models/runs/color-code-runs.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ To use metric or configuration-based colors for your runs, you need to configure

1. Navigate to your W&B project.
2. Select the **Workspace** tab from the project sidebar.
3. Click on the **Settings** icon in the top right corner.
3. Click the **Settings** icon in the top right corner.
4. From the drawer, select **Runs**.
5. In the **Run colors** section, select **Key-based colors**.
6. Configure the following options:
Expand All @@ -20,15 +20,15 @@ To use metric or configuration-based colors for your runs, you need to configure
- Set the number of buckets to a value from 2 to 8.

<Note>
When you use key-based colors, the option to [customize run colors](/models/runs/run-colors) is not available.
When you use key-based colors, the option to [customize run colors](/models/runs/run-colors) isn't available.
</Note>

The following sections describe how to set the metric and y value and as how to customize the buckets used for assigning colors to runs.
The following sections describe how to set the metric and y value and how to customize the buckets used for assigning colors to runs.

### Example: Key-based coloring with loss metric

In this example plot, runs are colored with a gradient where darker colors represent higher loss values and lighter colors represent lower loss values. The Y value is set to `latest` to use the most recent loss value for each run.
After you configure the previous settings and close the drawer, line plots in your **Workspace** tab update to use the new colors. In this example plot, **Key** is set to `loss` and **Y value** is set to `Latest`. Runs are colored with a gradient where darker colors represent higher loss values and lighter colors represent lower loss values.

<Image src="/images/app_ui/run-colors-key-based.png" alt="W&B workspace showing runs colored based on their loss values using key-based coloring." />

## Set a metric
Expand Down Expand Up @@ -91,22 +91,31 @@ Within the **Key** dropdown, `"learning_rate"`, `"batch_size"`, and `"optimizer"

You can choose from the following options:

- **Latest**: Determine color based on Y value at last logged step for each line.
- **Latest**: Color based on Y value at last logged step for each line.
- **Max**: Color based on highest Y value logged against the metric.
- **Min**: Color based on lowest Y value logged against the metric.

## Customize buckets

Buckets are ranges of values that W&B uses to categorize runs based on the metric or configuration key you select. Buckets are evenly distributed across the range of values for the specified metric or configuration key and each bucket is assigned a unique color. Runs that fall within that bucket's range are displayed in that color.
Buckets are ranges of values that W&B uses to categorize runs based on the metric or configuration key you select. Buckets are evenly distributed across the range of values for the specified metric or configuration key and each bucket is assigned a unique color. Runs that fall within that bucket's range are displayed in that color.

To view or edit buckets, open the workspace settings drawer where you enabled key-based colors:

Consider the following:
1. Navigate to your W&B project and select the **Workspace** tab.
2. Click the **Settings** icon in the top right corner.
3. In the drawer, select **Runs**.

@johndmulhausen johndmulhausen Jul 22, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🟡 Partially confirmed — the navigation labels here all match the app (Runs, Run colors, Key-based colors are the real UI strings). But in the frontend the Run colors controls sit under a Colors tab within the Runs settings panel: the e2e test selects the Runs menu item and then selects a separate Colors tab (getByRole('tab', {name:'Colors'})) before it can click Key-based colors. So a reader may need to select a Colors tab between step 3 (Runs) and step 4 (Run colors section).

Recommended: open a project workspace → Settings → Runs and check whether Run colors / Key-based colors shows immediately or only after selecting a Colors tab. If a click is required, add a "Select the Colors tab" step here and in the Turn on key-based colors section above (same 4-step nav). If Colors is the default tab, no change is needed.

Source: core:semantic_legends/utils.ts#L127-L131

🤖 CoreWeave Docs Team's Validator — partially confirmed

4. In the **Run colors** section, confirm that **Key-based colors** is selected. The **Buckets** section appears below the **Key** and **Y value** dropdowns.
Comment thread
johndmulhausen marked this conversation as resolved.
Outdated

@johndmulhausen johndmulhausen Jul 24, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🟡 Partially confirmed — the Buckets section is real, but it's conditionally rendered and these steps omit the precondition.

In the frontend, the Y value dropdown, the Number of buckets input, and the Buckets section only appear after you select a Key (the Key dropdown defaults to 'default'; the render guard is key !== DEFAULT…key). The entire key-based-colors feature is also disabled while run grouping is active ("Key-based colors are currently disabled because run grouping is active"). So a reader who opens Runs → Run colors → Key-based colors without picking a Key — or with grouping on — sees no Buckets section. (This matches a reviewer's report of not finding the section.)

Recommended: add a step to select a metric/config key from the Key dropdown before referring to the Buckets section, and note that key-based colors requires run grouping to be off. (Also note the UI has a separate "Number of buckets" stepper, distinct from the "Buckets" ranges section.)

Source: core:SemanticLegendColorTab…tsx#L97-L123, core:SemanticLegendBuckets…tsx#L103

🤖 CoreWeave Docs Team's Validator — partially confirmed


The following screenshot shows the **Runs** settings panel with buckets configured for an accuracy metric:

<Frame>
<img src="/images/track/color-coding-runs.png" alt="Color coded runs" />
<img src="/images/track/color-coding-runs.png" alt="Runs settings panel showing key-based colors with buckets configured for the accuracy metric." />
</Frame>

In this example:

- **Key** is set to `"Accuracy"` (abbreviated as `"acc"`).
- **Y value** is set to `"Max"`
- **Y value** is set to `"Max"`.

With this configuration, W&B colors each run based on their accuracy values. The colors vary from a light yellow color to a deep color. Lighter colors represent lower accuracy values, while deeper colors represent higher accuracy values.

Expand All @@ -119,8 +128,8 @@ Six buckets are defined for the metric, with each bucket representing a range of
- Bucket 5: (0.8214 - 0.8409)
- Bucket 6: (0.8409 - Max)

In the line plot below, the run with the highest accuracy (0.8232) is colored in a deep purple (Bucket 5), while the run with the lowest accuracy (0.7684) is colored in a light orange (Bucket 2). The other runs are colored based on their accuracy values, with the color gradient indicating their relative performance.
After you close the settings drawer, line plots in the workspace update to use the bucket colors. In the following line plot, the run with the highest accuracy (0.8232) is colored in a deep purple (Bucket 5), while the run with the lowest accuracy (0.7684) is colored in a light orange (Bucket 2). The other runs are colored based on their accuracy values, with the color gradient indicating their relative performance.

<Frame>
<img src="/images/track/color-code-runs-plot.png" alt="Color coded runs plot" />
<img src="/images/track/color-code-runs-plot.png" alt="Workspace line plot with runs colored by their maximum accuracy bucket." />
</Frame>
Loading