Agent skill

styled-jsx-csp-nonce

Configure styled-jsx to work with strict CSP using nonces (Next.js/custom Document patterns). Use when CSP blocks inline styles.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/styled-jsx-csp-nonce

SKILL.md

styled-jsx CSP Nonce Skill

Enable styled-jsx under strict Content-Security-Policy rules.

What to do

  1. Identify the framework (Next.js pages router, app router, custom SSR).
  2. Confirm where the nonce is generated (server) and how it reaches HTML.
  3. Ensure:
    • CSP header includes style-src with the same nonce
    • styled-jsx style tags receive the nonce attribute

Output expectations

  • Provide the minimal code changes needed in the appropriate files.
  • Include notes on where the nonce originates and how it propagates.
  • Avoid insecure CSP suggestions (do not recommend unsafe-inline).

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results