How to overwrite strong / b font weight?

[MickL]

How do I change the default font-weight of strong and b ? Tailwind sets it to bolder and all I can do is add a second style in my personal tailwind.css.

Sorry if it is obvious but I couldnt find this in the docs or by google.

[wongjn]

You could add a rule in your input CSS like:

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  strong, b {
    font-weight: <your desired value>;
  }
}

Or have a plugin add the rule:

module.exports = {
  // …
  plugins: [
    require('tailwindcss/plugin')(({ addBase }) => {
      addBase({
        'strong, b': {
          fontWeight: 'your desired value',
        },
      });
    }),
  ],
};

[MickL]

This is what I did but it adds another css rule instead of changing the original one.

[wongjn]

There is no API surface within Tailwind to change the existing rule directly. You could:

• Disable preflight and run your own version with modified CSS rules.
• Have a PostCSS plugin that runs after Tailwind that modifies the CSS rule, if you are running Tailwind via PostCSS.

[MickL]

Maybe this could be considered as a feature request? :)

[MickL]

Any update on this with Tailwind 4 @wongjn ? I see main.css sets:

b, strong {
    font-weight: bolder;
}

Any way to change this without overwriting it?

I created a feature request: #15970