Skip to content

Instantly share code, notes, and snippets.

@ripwu
Created January 4, 2026 13:37
Show Gist options
  • Select an option

  • Save ripwu/7cdd44bb1b1bec841479e19a56b175d1 to your computer and use it in GitHub Desktop.

Select an option

Save ripwu/7cdd44bb1b1bec841479e19a56b175d1 to your computer and use it in GitHub Desktop.
fix(ui, webview): improve table contrast in AntiGravity dark theme
<!--
fix(ui, webview): improve table contrast in AntiGravity dark theme
Problem:
Tables in the AntiGravity chat webview had extremely low contrast under dark themes
(e.g. One Dark Pro), making table text and borders nearly unreadable.
Root Cause:
VS Code theme color customizations (workbench.colorCustomizations) do not apply to
the AntiGravity chat panel because it is rendered inside an isolated WebView and
styled primarily with Tailwind CSS.
Solution:
Inject inline CSS in the webview entry HTML to explicitly override table text and
border colors. The colors are adjusted to improve readability while remaining soft
and non-intrusive in dark mode.
File locations:
- macOS:
/Applications/Antigravity.app/Contents/Resources/app/extensions/antigravity/cascade-panel.html
- Windows:
%LOCALAPPDATA%\Programs\Antigravity\resources\app\extensions\antigravity\cascade-panel.html
-->
<!doctype html>
<html>
<head>
<style>
/* Fix table text color contrast in dark theme - Softer colors */
table, thead, tbody, tr, th, td {
color: #cccccc !important;
}
th {
color: #dddddd !important;
font-weight: 600;
}
table {
border-color: rgba(156, 163, 175, 0.4) !important;
}
th, td {
border-color: rgba(156, 163, 175, 0.2) !important;
}
</style>
</head>
<body style="margin: 0">
<div id="react-app" class="react-app-container"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment