Css Tutor MCP Server

This repo contains a simple Model Context Protocol (MCP) server built with Node.js and TypeScript. It acts as a "CSS Tutor," providing personalized

Local serverstdioTypeScript

What is the Css Tutor MCP server?

Most developer tooling work still happens through a UI a human drives. Css Tutor MCP server moves it into the conversation instead. This repo contains a simple Model Context Protocol (MCP) server built with Node.js and TypeScript. It acts as a "CSS Tutor," providing personalized updates about CSS features to a connected AI client.

The tools it exposes

The server publishes 4 tools. What each one is for:

  • Tools — ** Actions the server can perform:
  • get_latest_updates — Fetches CSS news from OpenRouter/Perplexity
  • read_from_memory — Reads the content of the css_knowledge_memory resource
  • write_to_memory — Modifies the css_knowledge_memory resource

What it needs from you

Configuration is passed through the environment: OPENROUTER_API_KEY. Treat anything key-shaped as a real credential — scope it to the minimum the server needs, and rotate it if it ever lands in a shared config.

  • Node.js (v18 or later recommended) * npm (or your preferred Node.js package manager like yarn or pnpm) * An AI client capable of connecting to an MCP server (e.g., the Claude desktop app) * An OpenRouter API Key (for fetching live CSS updates via Perplexity)

Getting it running

The server ships on npm as @modelcontextprotocol/inspector, so your MCP client can launch it on demand — there is no separate build step. Add the server block to your client's configuration, restart it, and the tools register themselves.

How it compares

This sits in the developer tooling group, where several servers overlap in what they claim to do but differ sharply once you actually set them up. Css Tutor's toolset — Tools, get_latest_updates, read_from_memory and 1 more — is a fair guide to whether it matches your workflow. It is maintained by ebimopondei; worth a glance at recent repository activity before you build anything load-bearing on it.

We check each listing at SyncDev against the project's documentation before it goes live — if something here drifts out of date, it is a bug worth reporting.

Things to watch

  • It runs with your machine's permissions. That is convenient and also the reason to think about what you point it at before you approve a tool call.
  • Missing credentials fail quietly in some clients — if no tools show up, check the environment block first.
  • Keep per-call confirmation enabled while you learn its behaviour; it is the cheapest safeguard you have.

Available tools

ToolWhat it does
Tools** Actions the server can perform:
get_latest_updatesFetches CSS news from OpenRouter/Perplexity.
read_from_memoryReads the content of the css_knowledge_memory resource.
write_to_memoryModifies the css_knowledge_memory resource.

How to install the Css Tutor MCP server

{
  "mcpServers": {
    "css-tutor": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/inspector"],
      "env": {
        "OPENROUTER_API_KEY": "your-value"
      }
    }
  }
}

Add to claude_desktop_config.json, then restart Claude Desktop.

Configuration

  • Node.js (v18 or later recommended) * npm (or your preferred Node.js package manager like yarn or pnpm) * An AI client capable of connecting to an MCP server (e.g., the Claude desktop app) * An OpenRouter API Key (for fetching live CSS updates via Perplexity)
VariableDescriptionRequired
OPENROUTER_API_KEYCredential the server authenticates with.Yes

Example prompts to try

  • Use Css Tutor to Tools.
  • Use Css Tutor to get latest updates.
  • Use Css Tutor to read from memory.

Frequently asked questions

It connects Css Tutor to MCP-compatible AI assistants such as Claude and Cursor, exposing 4 tools (Tools, get_latest_updates, read_from_memory, and more) that the assistant can call on your behalf. Instead of copying data back and forth by hand, the assistant works with Css Tutor directly.