Gray color utilities do not follow text-{color}-{level} convention

[jcandan]

Prerequisites

• [X] I have searched for duplicate or closed issues
• [X] I have validated any HTML to avoid common problems
• [X] I have read the contributing guidelines

Describe the issue

When following the example given at Color: Generating utilities, the color naming convention applies to all but $grays.

<p class="text-green-300">this is successfully green</p>
<p class="text-gray-500">this should be a light gray</p>
<p class="text-500">this should be black because this class shouldn't exist</p>

Reduced test cases

https://codepen.io/jcandan/pen/yLRKLQv

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

Chrome

What version of Bootstrap are you using?

5.2.3

[afeefuddin]

Hey, I want to work on this issue can you please assign me this issue

[julien-deramond]

@afeefuddin We don't assign issues in this repository. If you think this issue is clear enough to be tackled already and that you have a solution for that, feel free to create a PR or discussion the solution here before starting the implementation.

[afeefuddin]

Hey @julien-deramond I have detected that there is a basic syntax error. I have fixed it and committed it in my personal branch in the forked project. I want to make a pull request . What live preview should i add ??? Please help me

[julien-deramond]

@afeefuddin You can create the PR and I'll show you the preview link that must be added. It won't be generated if the PR is not created.

[afeefuddin]

Made the PR #38585

[mdo]

Yes, this could be addressed in v6.

[jcandan]

Would you be willing to accept a documentation PR for v5?