How do I install the nativewind mcp server?

Use a recorded configuration for your client, replace example credential values and paths, and verify the documented runtime. Restart or reconnect the client, then inspect the available tools.

SSyncDev

Start a project

Nativewind MCP Server

Use Tailwindcss in your cross-platform React Native applications

Local serverstdio

What is the Nativewind MCP Server?

Use Tailwindcss in your cross-platform React Native applications

What you get

Nativewind makes sure you're using the best style engine for any given platform (e.g. CSS StyleSheet or StyleSheet.create). Its goals are to to provide a consistent styling experience across all platforms, improving developer UX, component performance, and code maintainability.

Works on all RN platforms, uses the best style system for each platform
Uses the Tailwind CSS compiler
Styles are computed at build time
Small runtime keeps your components fast
Custom CSS properties, aka CSS Variables
Dark mode, arbitrary classes, — and media queries

More MCP options

Compare MCP servers by category, or browse hosted MCP servers if you prefer an endpoint over a local process.

Maintainer setup documentation.

Recorded tools

Check the linked publisher documentation and your connected client's tool list. Names and availability can vary with the server version and account permissions.

Tool	What it does
container	type and style-based container queries are not supported

How to install the Nativewind MCP Server

{
  "mcpServers": {
    "server-nativewind": {
      "command": "npx",
      "args": ["-y", "rn-new"]
    }
  }
}

Add to claude_desktop_config.json, then restart Claude Desktop.

Example prompts to try

“Use Nativewind to container.”

Frequently asked questions

Use Tailwindcss in your cross-platform React Native applications Confirm the tools offered by your installed version in the connected client. Tool availability and permissions depend on the server and account configuration.