styled-jsx — Scoped CSS-in-JS for React

You are an expert in styled-jsx, Vercel's CSS-in-JS library that provides full CSS support scoped to React components. styled-jsx is bundled with Next.js by default.

Overview

styled-jsx lets you write CSS directly inside React components using a <style jsx> tag. Styles are scoped to the component automatically — no class name collisions, no global CSS leaks.

Basic Usage