feat(ui): add solid background color option for input prompt by jacob314 · Pull Request #16563 · google-gemini/gemini-cli

jacob314 · 2026-01-14T00:18:27Z

Remove vertical borders from the input prompt switching to a solid background color for the input prompt by default instead of a border.

Summary

Having vertical borders on the side of the input prompt bade copy and paste needlessly frustrating with extra ascii art ending up in the paste buffer

Details

This required a bunch of IE6 era hackery to make it work well enough on key terminals we care about. In particular the default Mac terminal is a pain because it is 256 colors and has too much padding between lines. The windows terminal by comparison works great for this.

We are clever and make it look like there is half a line of padding before and after the input prompt to make it look better than cases where a full line of padding is used which looks visually excessive

Related Issues

Fixes #14385

How to Validate

Test in iterm2, ghostty, and the default mac terminal.
Test on the windows terminal
Test on a linux terminal

Test with both a light theme, dark theme, and custom theme
The default mac terminal is unfortunately 256 colors which will exercise the escape hatch mode where we use a grey background color to avoid visually distracting backgrounds when mapping themes to 256 colors.

Screenshots:
Light theme:

Dark theme:

Dark theme mac terminal

Light theme mac terminal.

Note there are a couple extra lines due to the mac terminals line spacing issues. We chose the right unicode characters so that at least there are extra lines outside the buffer rather than inside. In dark mode, the extra lines are barely noticeable in the mac terminal.

Blue background mac terminal.
Here we intentionally fall back to using lines instead of a background color as we can't safely set a background due to only 256 colors.

gemini-code-assist · 2026-01-14T00:18:47Z

Summary of Changes

Hello @jacob314, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly refines the visual presentation of the input prompt by transitioning from a bordered design to a solid background color. This change enhances the user interface's modern aesthetic and introduces a new configuration option for user preference. The implementation includes robust logic to ensure visual consistency across various terminal environments, particularly concerning color depth capabilities.

Highlights

Input Prompt Visual Redesign: The input prompt's default styling has been updated to remove vertical borders, opting instead for a solid background color. This provides a cleaner, more integrated look.
New Configuration Option: A new setting, ui.useBackgroundColor, has been introduced. This boolean option, defaulting to true, allows users to toggle between the new background color styling and the traditional border-based prompt.
Dynamic Color Rendering: The input prompt now intelligently adapts its background color based on the terminal's reported color depth. In low color depth environments (e.g., 256-color terminals), it uses safe grayscale colors to avoid jarring approximations when blending, ensuring a consistent visual experience.
Test Suite Enhancements: New tests have been added to thoroughly validate the background color styling across different terminal color depths and background color configurations. Existing mouse interaction tests were also updated to reflect the removal of vertical borders.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	`/gemini review`	Performs a code review for the current pull request in its current state.
Pull Request Summary	`/gemini summary`	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	`/gemini help`	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

github-actions · 2026-01-14T00:22:05Z

Size Change: +15.4 kB (+0.07%)

Total Size: 23.4 MB

Filename	Size	Change
`./bundle/gemini.js`	23.4 MB	+15.4 kB (+0.07%)

ℹ️ View Unchanged

Filename	Size
`./bundle/sandbox-macos-permissive-closed.sb`	1.03 kB
`./bundle/sandbox-macos-permissive-open.sb`	890 B
`./bundle/sandbox-macos-permissive-proxied.sb`	1.31 kB
`./bundle/sandbox-macos-restrictive-closed.sb`	3.29 kB
`./bundle/sandbox-macos-restrictive-open.sb`	3.36 kB
`./bundle/sandbox-macos-restrictive-proxied.sb`	3.56 kB

_{compressed-size-action}

jacob314 · 2026-01-14T00:37:54Z

The dark theme ui when accepting edits is a little ugly. We might want to reconsider what background color we want for that mode. The yellow border looks a bit brown when blended.

Yolo mode by comparison looks good

jacob314 · 2026-01-14T02:26:25Z

Based on feedback from @jackwotherspoon changed the opacity to 8% from the 15% shown in screenshots

galz10 · 2026-01-15T00:10:24Z

+    // Interpolated background colors often look bad in 256-color terminals
+    // because the limited color palette can't represent the subtle blend,
+    // leading to jarring approximations.
+    if (isLowColorDepth) {


If isLowColorDepth is true and terminalBg is a non-extreme color (neither black nor white), backgroundColor becomes undefined. In this state, the horizontal padding is lost because paddingX on the outer box depends on !isLowColorDepth.

Suggested Fix: Update the outer box paddingX to paddingX={!backgroundColor ? 1 : 0} to ensure breathing room even in low-color fallback modes.

galz10 · 2026-01-15T00:11:12Z

+      ) : (
+        <Box width={mainAreaWidth} flexDirection="row">
+          <Text backgroundColor={backgroundColor} color={terminalBg}>
+            {'▀'.repeat(mainAreaWidth)}


The use of {'▀'.repeat(mainAreaWidth)} and {'▄'.repeat(mainAreaWidth)} is susceptible to RangeError crashes if mainAreaWidth becomes negative (e.g., during rapid window resizing or specific TTY initialization states).

Suggested Fix: Use Math.max(0, mainAreaWidth) to ensure the repeat count is always a valid non-negative integer.

galz10 · 2026-01-15T00:11:49Z

-        alignItems="flex-start"
-        minHeight={3}
+        alignItems="stretch"
+        minHeight={1}


nit: The reduction of minHeight from 3 to 1 might make the prompt feel vertically cramped in solid background mode. Consider a minHeight of 2 or adding paddingY to the inner container to maintain the "weight" of the input area.

discussed offline. minHeight 1 is equiv to 3 before.

galz10 · 2026-01-15T00:13:02Z

+      ) : (
+        <Box width={mainAreaWidth} flexDirection="row">
+          <Text color={terminalBg} backgroundColor={backgroundColor}>
+            {'▄'.repeat(mainAreaWidth)}


Nit: The rendering logic for the top ("▀") and bottom ("▄") caps is highly repetitive. Consider extracting a small helper function or component (e.g., PromptCap) to handle the conditional rendering between border-boxes and solid-background bars.

bdmorgan · 2026-01-23T20:46:28Z

Automatically closing PR as it is older than 7 days and authored by a team member.

Checkpoint showing a solid background color. Input prompt with background color. eckpoint fix: restore accidentally deleted code in InputPrompt.tsx Remove vertical borders from the input prompt switching to a solid background color for the input prompt by default instead of a border. refactor(ui): cleanup unused props and utilities in InputPrompt

Fix tests and merge conflicts.

jacob314 · 2026-01-26T22:35:43Z

Changes in the updated version:
use the background color for user messages in the history. For discussion: we use the unfocused background color for them but could use the focused one if we wanted.

Tweak so we use the same background color regardless of mode. The background color from the shell and yolo modes was distracting and not needed.
Updated the ink version to fix a render bug exposed by rendering a full width background.

jacob314 · 2026-01-26T22:47:34Z

Example screenshot:

galz10 · 2026-01-26T22:55:42Z

+  // We should fallback to lines if the background color is disabled OR if it is
+  // enabled but we are in a low color depth terminal where we don't have a safe
+  // background color to use.
+  const useLineFallback = useMemo(() => {


The logic for determining "safe" low-color backgrounds in useLineFallback is duplicated from the logic inside HalfLinePaddedBox. Consider extracting this terminal capability check (detecting if a "safe" background color can be rendered in low-color mode) into a shared utility or making HalfLinePaddedBox responsible for communicating its rendering state to the parent.

galz10 · 2026-01-26T22:57:17Z

+  const isLowColor = isLowColorDepth();
+
+  const backgroundColor = useMemo(() => {
+    if (!useBackgroundColor) {


The component defaults useBackgroundColor to true, but then checks it inside useMemo. It might be cleaner to handle the !useBackgroundColor case at the top of the component to avoid unnecessary hook execution or just return children early.

good idea. cleaned up.

galz10 · 2026-01-26T22:58:09Z

+
+  // We should fallback to lines if the background color is disabled OR if it is
+  // enabled but we are in a low color depth terminal where we don't have a safe
+  // background color to use.


InputPrompt uses useLineFallback to render horizontal lines when the background cannot be safely rendered, but UserMessage and UserShellMessage do not have a similar line-based fallback. This creates a slight visual inconsistency in low-color terminals where the prompt has lines but history items have nothing.

I don't think we should fallback for the user messages. showing the horizontal lines around them would be pretty annoying but if you can think of anything that would be good I'm all ears.

Co-authored-by: Alexander Farber <farber72@outlook.de>

…gemini#16563) Co-authored-by: Alexander Farber <farber72@outlook.de>

jacob314 requested a review from a team as a code owner January 14, 2026 00:18

This comment was marked as resolved.

Sign in to view

gemini-cli Bot added the status/need-issue Pull requests that need to have an associated issue. label Jan 14, 2026

jacob314 changed the title ~~input background~~ feat(ui): add solid background color option for input prompt Jan 14, 2026

jacob314 requested a review from a team as a code owner January 14, 2026 01:02

gemini-cli Bot added priority/p2 Important but can be addressed in a future release. area/core Issues related to User Interface, OS Support, Core Functionality and removed status/need-issue Pull requests that need to have an associated issue. labels Jan 14, 2026

jacob314 force-pushed the input_background branch 2 times, most recently from 2bb7750 to f57d5ad Compare January 14, 2026 01:47

jacob314 enabled auto-merge January 14, 2026 01:56

galz10 reviewed Jan 15, 2026

View reviewed changes

sehoon38 requested a review from a team as a code owner January 21, 2026 04:12

jacob314 mentioned this pull request Jan 22, 2026

Pipe characters (|) are copied when selecting prompt text #14898

Closed

jacob314 added the 🔒 maintainer only ⛔ Do not contribute. Internal roadmap item. label Jan 22, 2026

bdmorgan closed this Jan 23, 2026

auto-merge was automatically disabled January 23, 2026 20:46
Pull request was closed

jacob314 reopened this Jan 26, 2026

afarber and others added 4 commits January 26, 2026 12:32

Change opacity to 8%

c7a3d0f

Tweak colors for 256 color terminals as well.

1ec45ea

Further tweak colors for 256 color terminals.

acc9659

jacob314 force-pushed the input_background branch 3 times, most recently from 9fed54b to c885fdd Compare January 26, 2026 21:24

Make input prompt full width in alternate buffer mode

3f47d61

Fix tests and merge conflicts.

jacob314 force-pushed the input_background branch from c885fdd to 3f47d61 Compare January 26, 2026 22:05

galz10 approved these changes Jan 26, 2026

View reviewed changes

Code review comment fixes.

c0bbb94

jacob314 enabled auto-merge January 26, 2026 23:18

jacob314 added this pull request to the merge queue Jan 26, 2026

Merged via the queue into main with commit b5fe372 Jan 26, 2026
24 of 25 checks passed

jacob314 deleted the input_background branch January 26, 2026 23:36

yunaseoul pushed a commit that referenced this pull request Jan 27, 2026

feat(ui): add solid background color option for input prompt (#16563)

f942188

Co-authored-by: Alexander Farber <farber72@outlook.de>

ytakahashi1981 mentioned this pull request Feb 4, 2026

Input box background renders black in IDE integrated terminals (IntelliJ IDEA, VS Code) on Windows despite Light theme selection #18291

Open

soisyourface mentioned this pull request Feb 4, 2026

useBackgroundColor on tmux on alacritty: Can't See Prompt Text #18315

Closed

sidwan02 pushed a commit to sidwan02/gemini-cli-gemma that referenced this pull request Feb 6, 2026

feat(ui): add solid background color option for input prompt (google-…

3aa04e5

…gemini#16563) Co-authored-by: Alexander Farber <farber72@outlook.de>

kuishou68 pushed a commit to iOfficeAI/aioncli that referenced this pull request Feb 27, 2026

feat(ui): add solid background color option for input prompt (google-…

97a7c2d

…gemini#16563) Co-authored-by: Alexander Farber <farber72@outlook.de>

Conversation

jacob314 commented Jan 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Details

Related Issues

How to Validate

Uh oh!

gemini-code-assist Bot commented Jan 14, 2026

Summary of Changes

Highlights

Footnotes

Uh oh!

github-actions Bot commented Jan 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

This comment was marked as resolved.

Uh oh!

jacob314 commented Jan 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jacob314 commented Jan 14, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

bdmorgan commented Jan 23, 2026

Uh oh!

jacob314 commented Jan 26, 2026

Uh oh!

jacob314 commented Jan 26, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

jacob314 commented Jan 14, 2026 •

edited

Loading

github-actions Bot commented Jan 14, 2026 •

edited

Loading

jacob314 commented Jan 14, 2026 •

edited

Loading