Hover over styles.className in TSX/JSX files to see the applied CSS rules inline — no need to open the .module.css file.
Features
Hover preview: Hover any styles.className or styles['class-name'] inside a className prop (or anywhere in the file) to see the resolved CSS rules in a tooltip.
Supports dot and bracket notation: styles.container and styles['my-class'] both work.
Shows @media context: If a class appears inside a media query, the wrapping @media rule is shown too.
Works with any import name: Detects the CSS module import variable name automatically (e.g. import cx from './Foo.module.css').
Usage
Install the extension
Open a .tsx or .jsx file that imports a .module.css file
Hover over any styles.className reference
Development
cd css-module-inspector
npm install
npm run compile
Press F5 in VS Code to launch the Extension Development Host and test.
