About
Text and controls at a contrast of at least 7:1.
maintainers: VanitasCaesar1
owner: VanitasCaesar1 (first-party)
licence: MIT
Source
repository: github.com/VanitasCaesar1/hippo
directory: packs/high-contrast
commit: c2590adf628f4586f75f2d6a44d0c246a011bec9
github.com/VanitasCaesar1/hippo//packs/high-contrast@c2590adf628f4586f75f2d6a44d0c246a011bec9
pack hash: 06079e09efdae5825b91d69089470ba4de4ec57387d195ae8241a54284310bef
Install
hippo add high-contrast --registry <path to index.json>
Theme
- theme web: theme.css, contract 1, 1124 bytes
- theme desktop: theme.json, format 1, 2746 bytes
Review
review 01M77CQPEM3QAQ9P1MYXFRS0K0: confirm, 2026-11-12
reviewer: pack-reviewer
A colour-only theme pack that does what its README says. theme.css contains only two :root blocks (light, and dark under prefers-color-scheme) that set the contract's --hp-* custom properties. It has no selectors of its own, imports, URLs, fonts, content, display or position rules, so it cannot hide, move or relabel sources, reviews, warnings or counts. theme.json contains only theme names, hex colours and font_size 14, which matches the README. Neither file imitates another site's or product's branding. I spot-checked the contrast claims and they hold: muted, link, visited and error text are about 8.5:1 or better on the content and code backgrounds in both schemes. The bar text, input text, focus outlines, vote arrow and input borders are well above 7:1. On the desktop, muted text stays at or just above 7:1 on the panel, hover and selected surfaces, with about 7.03:1 as the tightest case, on dark selected. The pack has no passes, prompts, personas, templates or fixtures, and no text tries to instruct the reviewer or a model. The README's description of how to choose and apply the theme fits a pure data theme. The LICENSE is standard MIT.
README.md (2242 bytes)
# High contrast A theme that sets text and controls at a contrast of at least 7:1, for the registry and feed pages in a browser and for Hippo.app. ## What it changes - **Web (`theme.css`)**: the colours of the web theme contract. In the light scheme and in the dark scheme, which it follows from the device, every text pair of the contract (text, muted text, links, visited links and error text on the content, code and page backgrounds; input text on its field; the top bar's text on its bar) has a contrast of 7:1 or more. The focus outlines, the upvote arrow and the field borders are at least 7:1 as well. It sets no size, font or width. - **Desktop (`theme.json`)**: two themes for Hippo.app, High Contrast Light and High Contrast Dark, with text and muted text at 7:1 or more on every surface the app draws, focus rings in blue (`#0000cc`) in the light theme and yellow (`#ffff66`) in the dark, and strong borders. The text size is 14. ## Nothing in it runs A theme is data. `theme.css` holds only `:root` blocks that set the contract's custom properties, with no selector of its own, no import, no URL and no font to download. `theme.json` holds only names, colours and one number, the text size. `hippo add` checks both files with the rules that guard each format before it writes anything, and a pack review reads them too. ## How to choose it Hippo.app's theme picker lists it now. The feed is not deployed yet, so to see the web theme, build the registry site from a checkout (`hippo-registry build`) and add the lines of `theme.css` to the end of the `hippo.css` it writes. - **Hippo.app**: after `hippo add high-contrast`, open the theme picker (Command-Shift-T) and pick High Contrast Light or High Contrast Dark. The picker lists the themes of installed theme packs after the built-in ones and your own files. - **The feed** (not deployed): when the feed lists this pack, its `/themes` page offers it with a *use* button for a signed-in member. Your own pages then use it in place of a built-in theme. The sign-in, settings and admin pages keep a built-in theme, so you can always get back. ## Notes The pack sets colours only, so the layout, sizes and fonts stay the contract's. It does not change what a page says.
LICENSE (1071 bytes)
MIT License Copyright (c) 2026 Vanitas Caesar Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
pack.toml (232 bytes)
protocol = "HIPPO_V1" name = "high-contrast" kind = "theme" version = "1.0.0" description = "Text and controls at a contrast of at least 7:1." authors = ["Vanitas Caesar"] license = "MIT" theme_contract = 1 desktop_theme_format = 1
theme.css (1124 bytes)
/* High contrast: every text pair of the contract at 7:1 or more, in the
light scheme and in the dark scheme. */
:root {
--hp-page-bg: #ffffff;
--hp-content-bg: #ffffff;
--hp-text: #000000;
--hp-muted: #3d3d3d;
--hp-link: #0000cc;
--hp-link-visited: #4b0082;
--hp-bar-bg: #000000;
--hp-bar-text: #ffffff;
--hp-bar-focus: #ffff66;
--hp-vote: #000000;
--hp-focus: #0000cc;
--hp-rule: #595959;
--hp-code-bg: #eeeeee;
--hp-input-bg: #ffffff;
--hp-input-text: #000000;
--hp-input-border: #000000;
--hp-error: #8b0000;
--hp-color-scheme: light;
}
@media (prefers-color-scheme: dark) {
:root {
--hp-page-bg: #000000;
--hp-content-bg: #000000;
--hp-text: #ffffff;
--hp-muted: #cccccc;
--hp-link: #99ccff;
--hp-link-visited: #d9b3ff;
--hp-bar-bg: #262626;
--hp-bar-text: #ffffff;
--hp-bar-focus: #ffff66;
--hp-vote: #cccccc;
--hp-focus: #ffff66;
--hp-rule: #808080;
--hp-code-bg: #1a1a1a;
--hp-input-bg: #1a1a1a;
--hp-input-text: #ffffff;
--hp-input-border: #ffffff;
--hp-error: #ff9999;
--hp-color-scheme: dark;
}
}
theme.json (2746 bytes)
{
"name": "High Contrast",
"author": "Vanitas Caesar",
"themes": [
{
"name": "High Contrast Light",
"appearance": "light",
"style": {
"background": "#ffffff",
"editor.background": "#ffffff",
"title_bar.background": "#ffffff",
"status_bar.background": "#ffffff",
"tab.active_background": "#ffffff",
"elevated_surface.background": "#ffffff",
"panel.background": "#f2f2f2",
"surface.background": "#f2f2f2",
"tab_bar.background": "#f2f2f2",
"tab.inactive_background": "#f2f2f2",
"text": "#000000",
"text.muted": "#3d3d3d",
"text.placeholder": "#4d4d4d",
"text.accent": "#0000cc",
"border": "#000000",
"border.variant": "#595959",
"border.focused": "#0000cc",
"border.selected": "#0000cc",
"scrollbar.thumb.background": "#595959",
"ghost_element.hover": "#e6e6e6",
"element.hover": "#e6e6e6",
"ghost_element.selected": "#cce0ff",
"element.selected": "#cce0ff",
"search.match_background": "#fff3a3",
"deleted": "#8b0000",
"deleted.background": "#ffe0e0",
"created": "#005000",
"created.background": "#e0ffe0",
"success": "#005000",
"error": "#8b0000",
"warning": "#6b3f00"
},
"hippo": {
"font_size": 14
}
},
{
"name": "High Contrast Dark",
"appearance": "dark",
"style": {
"background": "#000000",
"editor.background": "#000000",
"title_bar.background": "#000000",
"status_bar.background": "#000000",
"tab.active_background": "#000000",
"elevated_surface.background": "#0d0d0d",
"panel.background": "#0d0d0d",
"surface.background": "#0d0d0d",
"tab_bar.background": "#0d0d0d",
"tab.inactive_background": "#0d0d0d",
"text": "#ffffff",
"text.muted": "#cccccc",
"text.placeholder": "#b3b3b3",
"text.accent": "#99ccff",
"border": "#ffffff",
"border.variant": "#999999",
"border.focused": "#ffff66",
"border.selected": "#ffff66",
"scrollbar.thumb.background": "#cccccc",
"ghost_element.hover": "#262626",
"element.hover": "#262626",
"ghost_element.selected": "#1a3a6b",
"element.selected": "#1a3a6b",
"search.match_background": "#665500",
"deleted": "#ff9999",
"deleted.background": "#4d0000",
"created": "#99ff99",
"created.background": "#003300",
"success": "#99ff99",
"error": "#ff9999",
"warning": "#ffcc66"
},
"hippo": {
"font_size": 14
}
}
]
}