[PR #19601] [CLOSED] feat: Add per-model accent colors with intensity control #40890

New Issue

GiteaMirror · 2026-04-25T13:16:30-05:00

GiteaMirror commented

2026-04-25 13:16:30 -05:00

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/19601
Author: @troylar
Created: 11/30/2025
Status: ❌ Closed

Base: dev ← Head: feat/model-accent-colors

📝 Commits (1)

c5cddfa feat: Add per-model accent colors with intensity control

📊 Changes

16 files changed (+1064 additions, -436 deletions)

View changed files

📝 backend/open_webui/config.py (+47 -0)
📝 backend/open_webui/main.py (+2 -0)
📝 backend/open_webui/models/models.py (+12 -0)
📝 backend/open_webui/routers/configs.py (+25 -1)
📝 src/app.css (+62 -0)
📝 src/lib/apis/configs/index.ts (+59 -1)
📝 src/lib/components/admin/Settings/Interface.svelte (+27 -3)
➕ src/lib/components/admin/Settings/Interface/ModelColors.svelte (+182 -0)
📝 src/lib/components/chat/Chat.svelte (+15 -1)
📝 src/lib/components/chat/MessageInput.svelte (+1 -1)
📝 src/lib/components/chat/Messages/ResponseMessage.svelte (+1 -1)
📝 src/lib/components/workspace/Models/ModelEditor.svelte (+436 -426)
📝 src/lib/stores/index.ts (+7 -1)
📝 src/lib/types/index.ts (+28 -0)
📝 src/lib/utils/index.ts (+152 -0)
📝 src/routes/(app)/+layout.svelte (+8 -1)

📄 Description

Pull Request Checklist

Before submitting, make sure you've checked the following:

Target branch: Verify that the pull request targets the dev branch.
Description: Provided below.
Changelog: Included below.
Testing: Manual testing performed.
Agentic AI Code: Human reviewed and manually tested.
Code review: Self-review completed.
Title Prefix: Using feat: prefix.

Changelog Entry

Description

Add the ability to set custom accent colors for models that provide visual distinction during conversations. This helps users quickly identify which model they're interacting with.

Added

accent_color field to ModelMeta in the backend for per-model accent color configuration
accent_intensity field (0.1-1.0) for controlling color intensity per model
Color picker and hex input UI in the Model Editor under the Description section
Intensity slider that visually previews the color at the selected intensity
resolveModelAccent utility function with base model inheritance
Accent colors applied to chat UI with model-specific intensity

Changed

N/A

Deprecated

N/A

Removed

N/A

Fixed

N/A

Security

N/A

Breaking Changes

N/A

Additional Information

Opt-in behavior: no styling changes unless a model explicitly has an accent color set
Intensity defaults to 35% for subtle, non-distracting appearance
Both color and intensity support "Default" mode for inheritance
Slider track itself shows the color preview at current intensity

Screenshots or Videos

Manual testing completed locally

Contributor License Agreement

By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.

🤖 Generated with Claude Code

Accent Color (Default)

Accent Color Settings in Model

Prompt Box with Accent Color

Response and Prompt Box with Accent Color

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/19601 **Author:** [@troylar](https://github.com/troylar) **Created:** 11/30/2025 **Status:** ❌ Closed **Base:** `dev` ← **Head:** `feat/model-accent-colors` --- ### 📝 Commits (1) - [`c5cddfa`](https://github.com/open-webui/open-webui/commit/c5cddfa7add150db565c4d4dfdaf93a69fe83ca5) feat: Add per-model accent colors with intensity control ### 📊 Changes **16 files changed** (+1064 additions, -436 deletions) <details> <summary>View changed files</summary> 📝 `backend/open_webui/config.py` (+47 -0) 📝 `backend/open_webui/main.py` (+2 -0) 📝 `backend/open_webui/models/models.py` (+12 -0) 📝 `backend/open_webui/routers/configs.py` (+25 -1) 📝 `src/app.css` (+62 -0) 📝 `src/lib/apis/configs/index.ts` (+59 -1) 📝 `src/lib/components/admin/Settings/Interface.svelte` (+27 -3) ➕ `src/lib/components/admin/Settings/Interface/ModelColors.svelte` (+182 -0) 📝 `src/lib/components/chat/Chat.svelte` (+15 -1) 📝 `src/lib/components/chat/MessageInput.svelte` (+1 -1) 📝 `src/lib/components/chat/Messages/ResponseMessage.svelte` (+1 -1) 📝 `src/lib/components/workspace/Models/ModelEditor.svelte` (+436 -426) 📝 `src/lib/stores/index.ts` (+7 -1) 📝 `src/lib/types/index.ts` (+28 -0) 📝 `src/lib/utils/index.ts` (+152 -0) 📝 `src/routes/(app)/+layout.svelte` (+8 -1) </details> ### 📄 Description # Pull Request Checklist **Before submitting, make sure you've checked the following:** - [x] **Target branch:** Verify that the pull request targets the `dev` branch. - [x] **Description:** Provided below. - [x] **Changelog:** Included below. - [x] **Testing:** Manual testing performed. - [x] **Agentic AI Code:** Human reviewed and manually tested. - [x] **Code review:** Self-review completed. - [x] **Title Prefix:** Using `feat:` prefix. # Changelog Entry ### Description Add the ability to set custom accent colors for models that provide visual distinction during conversations. This helps users quickly identify which model they're interacting with. ### Added - `accent_color` field to `ModelMeta` in the backend for per-model accent color configuration - `accent_intensity` field (0.1-1.0) for controlling color intensity per model - Color picker and hex input UI in the Model Editor under the Description section - Intensity slider that visually previews the color at the selected intensity - `resolveModelAccent` utility function with base model inheritance - Accent colors applied to chat UI with model-specific intensity ### Changed - N/A ### Deprecated - N/A ### Removed - N/A ### Fixed - N/A ### Security - N/A ### Breaking Changes - N/A --- ### Additional Information - Opt-in behavior: no styling changes unless a model explicitly has an accent color set - Intensity defaults to 35% for subtle, non-distracting appearance - Both color and intensity support "Default" mode for inheritance - Slider track itself shows the color preview at current intensity ### Screenshots or Videos - Manual testing completed locally ### Contributor License Agreement By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](https://github.com/open-webui/open-webui/blob/main/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Accent Color (Default) <img width="3188" height="740" alt="CleanShot 2025-11-30 at 05 14 21@2x" src="https://github.com/user-attachments/assets/6d1b81e5-95b8-42dd-ba6e-9038ce776ca3" /> Accent Color Settings in Model <img width="3186" height="738" alt="CleanShot 2025-11-30 at 05 13 21@2x" src="https://github.com/user-attachments/assets/fdfec618-7923-49e6-a1b6-fc05d4456196" /> Prompt Box with Accent Color <img width="1704" height="936" alt="CleanShot 2025-11-30 at 05 15 35@2x" src="https://github.com/user-attachments/assets/1eed3b63-ce5c-406e-97cc-83c248556e43" /> Response and Prompt Box with Accent Color <img width="2930" height="2306" alt="CleanShot 2025-11-30 at 05 16 54@2x" src="https://github.com/user-attachments/assets/6622f098-b29b-4731-9e5b-58bb77363402" /> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

GiteaMirror added the pull-request label 2026-04-25 13:16:30 -05:00

GiteaMirror closed this issue

2026-04-25 13:16:30 -05:00

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/open-webui#40890