# CSS Specificity Calculator MCP

## Overview
- **Category:** developer-tools
- **Price:** Free
- **Endpoint:** https://edge.vinkius.com/vk_preview_xXEEg1MTGyvC1lJplSeQYoN9TpTw1sM93hiIsUQl/mcp
- **Tags:** css, specificity, web-dev, frontend, selector-validation

## Prompt Examples

**Prompt:** 
```
What is the specificity of `#header .menu li`?
```

**Response:** 
```
The selector `#header .menu li` has 1 ID, 1 class/attribute/pseudo-class, and 2 elements/pseudo-elements.
```

**Prompt:** 
```
Is `div > p` a valid selector?
```

**Response:** 
```
Yes, `div > p` is a syntactically valid CSS selector.
```

**Prompt:** 
```
Which selector wins: `.active` or `#main-nav`?
```

**Response:** 
```
`#main-nav` wins because it contains an ID selector, which has higher precedence than a class selector.
```

## Frequently Asked Questions

**How does the calculation work?**
It counts IDs, classes, attributes, pseudo-classes, elements, and pseudo-elements according to W3C standards. Tools available: `your_tool_name`.

**Can I compare two selectors?**
Yes, use `compare_selectors` to see which one wins a conflict.

**Does it handle !important?**
Yes, the `compare_selectors` tool can account for an importance override.