Nostalgiaui

io.github.sylvesterworksPublished by GitHub account sylvesterworksv0.1.3Updated Nov 2, 2026

Design tokens, component source and WCAG checks for rendering any UI in a past design era.

VerifiedSTDIODesktop onlyDeveloper ToolsMedia & Design

Overview

AI-generated overview

Gives coding agents NostalgiaUI's design eras, palettes, design tokens, component source and WCAG contrast checks for retro-styled UI.

What you can do
  • List the available design eras and colour palettes, with appearance and source licence
  • Fetch design tokens for an era and palette pairing as CSS custom properties, a Tailwind preset or W3C Design Tokens JSON
  • Retrieve component source for one era: imports, TSX wrapper, stylesheet rules, props table and structured docs, optionally one section only
  • Convert a VS Code colour theme JSON into a palette with a provenance report and CSS variables
  • Audit WCAG 2.1 contrast for an era and palette pairing and list failures
When to use it
Useful when an assistant is asked to build or restyle a UI in a specific retro design era and should use real tokens and component source instead of guessing. Also handy for checking contrast of an era and palette combination or turning an existing VS Code theme into a palette.
Requirements
Runs locally over stdio, typically launched with npx from the npm package @nostalgiaui/mcp; needs Node.js and network access to fetch the package. No accounts, API keys or environment variables are declared.
Before you install
The server returns code and CSS that the assistant may apply to your project, so review generated component source before committing it. Imported VS Code themes are processed locally and their licence is reported by the palette listing; check it before redistributing derived palettes.

Installation

In SourceWeft

  1. Open Nostalgiaui in the dashboard and add it to a workspace.
  2. Enable the server for the chats that should use its tools.

Desktop only via STDIO. STDIO servers start a local process, so they need the SourceWeft desktop host.

Other MCP clients

Follow the launch instructions in the repository.

README

@nostalgiaui/mcp

An MCP server that gives AI coding agents NostalgiaUI's eras, palettes, component source and contrast checks, so an agent asked for a settings page in Frutiger Aero with the Nord palette can get the real tokens rather than guess.

Tools: list_eras, list_palettes, get_tokens, get_component, import_vscode_theme, check_contrast.

Claude Code

bash
claude mcp add --transport stdio nostalgiaui -- npx -y @nostalgiaui/mcp

Claude Desktop

In claude_desktop_config.json:

json
{  "mcpServers": {    "nostalgiaui": {      "command": "npx",      "args": ["-y", "@nostalgiaui/mcp"]    }  }}

get_component returns more than source: the import line, the era-specific CSS, a props table for each part extracted from the TypeScript types, and the component's structured doc. The doc covers anatomy, patterns, do and don't pairs, accessibility, extensibility, notes for the requested era, and notes naming what is easy to get wrong. Pass section, for example accessibility, to receive only that part. The rules every component shares, such as rendering inside NostalgiaRoot, are sent once as the server's instructions rather than repeated in each answer.

Full documentation at nostalgiaui.sylvester.works. MIT, copyright Josh Sylvester and Sylvester Works LLC.

MCP Registry

Listed as io.github.sylvesterworks/nostalgiaui. The listing is server.json in this package and is published by the release workflow after each npm publish, authenticated through GitHub OIDC; nothing is done by hand.

Source: packages/mcp/README.md at commit 68614d8

Tools

6

list_eras

List the design eras NostalgiaUI can render. An era controls shape and feel: radius, borders, bevels, shadows, typography, density and motion. It never controls colour.

Takes no parameters.

list_palettes

List the colour palettes, each drawn from a VS Code theme, with its light or dark appearance and source licence. A palette controls colour only and works in every era.

Takes no parameters.

get_tokens

Design tokens for one era and palette pairing. css returns the CSS custom properties scoped to data-era and data-palette attributes. tailwind returns a preset mapping utilities onto those variables. dtcg returns W3C Design Tokens JSON.

Parameterserarequiredformatrequiredpaletterequired

get_component

Source for one component styled for one era: the import lines, the TSX wrapper, the stylesheet rules that apply everywhere, the rules scoped to that era, and notes on what is easy to get wrong. The CSS is a filtered view of the stylesheet, not a verbatim copy: rules for other eras and section-divider comments are removed, while comments inside rules are kept. Components must render inside NostalgiaRoot.

Parameterserarequirednamerequired

import_vscode_theme

Turn a VS Code colour theme JSON into a NostalgiaUI palette. Returns the palette primitives, a provenance report saying which values came straight from the theme and which had to be inferred, and the resulting CSS variables.

Parametersthemerequired

check_contrast

Audit WCAG 2.1 contrast for one era and palette pairing. Returns every checked pairing with its ratio and the threshold it must meet, and lists any failures. Colours are derived per pairing, so contrast cannot be known from either axis alone.

Parameterserarequiredpaletterequired

Version history

2
  1. v0.1.3LatestOct 26, 2026
  2. v0.1.2Oct 26, 2026

Score

90% of the applicable checks met

How complete this listing is, computed from the registry entry, the endpoint and public sources. Not a rating of the server and not a statement that it is safe or working today: reachability is a dated check, and no installs or reviews go into the score.

  • Reached in the last 30 days25 pts
  • Auth declared10 pts

    Declare the credential headers in the registry entry, or keep the endpoint answering the probe so its auth can be classified.

  • Tools listedRequired15 pts
  • DescriptionRequired15 pts
  • Logo10 pts
  • Documentation15 pts
  • License10 pts