CSS MCP Server

An MCP (Model Context Protocol) server that provides up-to-date CSS documentation from MDN, with intelligent caching.

Features

Simple API - Just pass CSS property names like "grid", "flexbox", or ":has" Official MDN Docs - Fetches documentation directly from MDN's API Markdown Conversion - Converts HTML documentation to clean, readable markdown Smart Caching - SQLite-based cache with 7-day TTL for blazing-fast responses Auto-normalization - Supports both simple slugs ("grid") and full paths ("Web/CSS/grid") Browser Compatibility - Includes browser support data from MDN's BCD

Installation

For MCP Clients (Claude Desktop, etc.)

Add to your MCP settings configuration:

For Development

Or use with npx:

Requirements

• Node.js 20+

• Build tools for native modules (usually pre-installed on most systems)

Usage

Available Tools

get_docs

Fetch CSS documentation for any property, selector, function, or concept.

Parameters:

• slug (string) - CSS feature name or MDN path

Examples:

Returns:

get_browser_compatibility

Fetch browser compatibility data for CSS features.

Parameters:

• bcd_id (string) - Browser Compat Data ID (e.g., "css.properties.grid")

Example:

Cache Management

The server automatically:

• Creates cache at ~/.cache/css-mcp/cache.db

• Cleans up expired entries on startup

• Tracks hit counts for each cached entry

• Uses WAL mode for better concurrent performance

To clear the cache:

Self-Test

Verify the server is working correctly:

Expected output:

Example: Using with Claude Code

Once configured, you can ask Claude Code:

"Use the CSS MCP to get documentation for flexbox"

"What browser support does :has selector have?"

"Explain how CSS grid works"

Claude will automatically use the MCP to fetch the latest MDN documentation.

Development

Performance

With caching enabled:

• First fetch: ~400-500ms (network + cache write)

• Cached fetch: ~100ms (~5x faster)

• Cache size: ~390KB for typical usage

Troubleshooting

"Module did not self-register"

This usually means native modules need rebuilding:

Cache not working

Check cache directory permissions:

Should show cache.db, cache.db-shm, and cache.db-wal files.

Contributing

This is an experimental MCP server for CSS documentation tooling, let's work on tools that make AI better at CSS