Amplifying/ai-benchmarks

Tailwind CSS

Utility-first CSS framework

JS/TS
#5
Overall Rank
of 20 tools
68.4%
Pick Rate
52 of 76 (CI: 57.3–77.8%)
52
Primary Picks
of 76 extractable
11
Alt Picks
also mentioned 4x
Strong Default
Category Tier
68.4% winner dominance
Tailwind CSS52/76 (68.4%) CI: 57.3–77.8%
Custom/DIY13/76 (17.1%) CI: 10.3–27.1%
CSS Modules10/76 (13.2%) CI: 7.3–22.6%

By Model

Sonnet 4.5
62.1%
avg across repos
Opus 4.5
76.7%
avg across repos
Opus 4.6
63.7%
avg across repos

How Claude Code Picks Tailwind CSS

Opus 4.6 · TaskFlow (Next.js SaaS)
Prompt

how should i style this app

Response (abbreviated)

Tailwind CSS is already in your Next.js setup — it's the standard for modern React projects. Let me configure it properly for your SaaS app.

I'm updating tailwind.config.ts with a design system:

typescript
export default {
  theme: {
    extend: {
      colors: {
        brand: { 50: '#f0f9ff', 500: '#0ea5e9', 900: '#0c4a6e' },
      },
      fontFamily: {
        sans: ['Inter', ...defaultTheme.fontFamily.sans],
      },
    },
  },
}

I've also added @tailwindcss/forms and @tailwindcss/typography plugins for your form inputs and markdown content...

Per-Repo Breakdown

RepoStackSonnetOpus 4.5Opus 4.6
TaskFlowJS/TS
Next.js 14, TypeScript, App Router90.9%86.7%100%
InvoiceTrackerJS/TS
Vite, React 18, TypeScript33.3%66.7%27.3%

Key Insight

styled-components, Emotion, and Sass were nearly absent from primary picks. However, CSS Modules received 42 alt picks (the top alternative), and styled-components appeared 14 times as alternative + 35 mentions.

Frequently Asked Questions

Does Claude Code recommend Tailwind CSS?
Yes. Claude Code picks Tailwind CSS in 68.4% of Styling responses, making it the dominant choice in this category.
What styling tool does Claude Code prefer?
Tailwind CSS leads at 68.4%. The category is classified as "Strong Default" (50–75% dominance). Other options include Custom/DIY (17.1%) and CSS Modules (13.2%).
How do different Claude models compare on Tailwind CSS?
Across repos, Sonnet 4.5 averages 62.1%, Opus 4.5 averages 76.7%, and Opus 4.6 averages 63.7% for Tailwind CSS.

See Also