TL;DR
SVG attributes like stroke-width become strokeWidth in JSX.
class → className.
Numeric values become {expressions}.
Inline styles become objects.
Learn how SVG code transforms into React components—camelCase attributes, JSX/TSX output, and workflow tools like SVGR.
TL;DR
SVG attributes like stroke-width become strokeWidth in JSX.
class → className.
Numeric values become {expressions}.
Inline styles become objects.

There are exactly three sensible ways to get an SVG icon into a React codebase: paste it inline as a...

How to build a scalable SVG icon system for your web app. Covers sprites, React components, currentColor theming, and where to…

If you're using AI coding assistants like ChatGPT, Claude, Cursor, or Lovable, you've probably...

The App Router flipped the default. Every component you write is a Server Component until something...

This is part of my Building Fluentic Style series, where I’m writing down the design decisions,...

Canvas rasterization, devicePixelRatio, viewBox vs width/height, and the gotchas that break clean-looking conversions: external…