JavaScript - Regex with decimal values

Question

I am trying to create a regular expression that validates an red/green/blue value expression. The expressions that I need my regular expression to match include:

rgb(1, 10, 100)
rgb(100, 10, 1)
rgb(1,2,3)
rgba(1, 2, 3, .75)
rgba(1, 2, 3, 0.75)
rgba(1, 2, 3, 0)
rgba(1, 2, 3, 1)

Currently, I have the following regular expression:

^rgba?\((([+-]?\d+(\.\d+)?),\s*){2}[+-]?\d+(\.\d+)?(,\s*(0?\.\d|[01]))?\)$

This expression works for #1, #2, #3, #6, and #7. However, it fails for #4 and #5. I keep staring at the last group. To me, it looks like it should accept a decimal. Clearly, it's not though. What am I doing wrong?

or [regex javascript to match both RGB and RGBA](https://stackoverflow.com/questions/7543818/regex-javascript-to-match-both-rgb-and-rgba) and [Regex Pattern for Rgb, Rgba, Hsl, Hsla color coding](https://stackoverflow.com/questions/12385500/regex-pattern-for-rgb-rgba-hsl-hsla-color-coding) — pilchard, Oct 29 '21 at 15:45
Let me know if the solution I provided worked for you. If so please be sure to mark the question as solved (By selecting the answer)! — Brakke Baviaan, Oct 29 '21 at 16:25
Due to code formatting issues, my regular expression wasn't properly displayed. It should have been fixed now! — Brakke Baviaan, Oct 29 '21 at 16:39

score 0 · Accepted Answer · edited Oct 31 '21 at 06:05

The problem in your regular expression, is that your expression doesn't allow for values greater than length 1 behind the last decimal point. Considering the original regular expession:

^rgba?\((([+-]?\d+(\.\d+)?),\s*){2}[+-]?\d+(\.\d+)?(,\s*(0?\.\d|[01]))?\)$

You will get a positive value for rgba(1, 2, 35.132, 0.7), but negative for rgba(1, 2, 35.132, 0.75).

The solution is adding a star to the last \d digit denotator, indicating that there can be any amount of digits. A plus would be even better, as it would detect faulty values that have 0 digits behind a decimal point, by requiring at least 1 of the \d instance.

^rgba?\((([+-]?\d+(\.\d+)?),\s*){2}[+-]?\d+(\.\d+)?(,\s*(0?\.\d*|[01]))?\)$

JavaScript - Regex with decimal values

1 Answers1