Consistency

no-duplicate-class-strings

Flag identical className strings repeated 3+ times in a file.

Detects identical full className strings repeated three or more times in a single file — a textbook signal that an extraction is missing. AI agents copy whole class strings between siblings; the rule keeps the codebase composable.

Behavior

• Fixable: No.
• Suggestions: No.

Options

["warn", {
  "threshold": 3,
  "minClassCount": 3
}]

Examples

Bad:

<div className="flex items-center gap-4 p-4 rounded-lg" />
<div className="flex items-center gap-4 p-4 rounded-lg" />
<div className="flex items-center gap-4 p-4 rounded-lg" />

Good:

const cardClasses = "flex items-center gap-4 p-4 rounded-lg";
<div className={cardClasses} />

Related rules

• max-tailwind-classesFlag elements with too many Tailwind utility classes.
• no-conflicting-classesDetect contradictory Tailwind classes on the same element.
• max-component-linesFlag single-file components exceeding a configurable line count.

Use it

Enable no-duplicate-class-strings in your eslint.config.js:

import deslint from '@deslint/eslint-plugin';

export default [
  {
    plugins: { deslint },
    rules: {
      'deslint/no-duplicate-class-strings': 'error',
    },
  },
];

Found a false positive? Report it on GitHub →

← Back to all rules