How to create a form field that turns different colors depending on its value?

[Matt36991512vw7f]

For example:

If the value of the field is between 8-10: turn the field red.

If the value of the field is between 6-10: turn the field orange.

If the value of the field is between 4-6: turn the field yellow.

If the value of the field is between 0-4: turn the field green.

Also I would like to be able to change the fill of the field as well as the color of the text.

(for example a red fill with white text, but a yellow fill with black text) so that everything is readable.

[Thom Parker]

Use the Custom Validation script on each field.  

For example: 

    if(event.value <=4 )

         event.target.fillColor = color.green;

Here's an article on how to edit field properties such as the Validation Script.  

https://www.pdfscripting.com/public/Editing-Fields-Properties.cfm

Here's the reference entry for form field properties:

https://opensource.adobe.com/dc-acrobat-sdk-docs/library/jsapiref/JS_API_AcroJS.html#field-propertie...

You'll find more information on scripting form fields here:

https://www.pdfscripting.com/public/PDF-Form-Scripting.cfm

You're value ranges are unworkable, so you'll need to modify them. 

[try67]

Just be aware that not all colors have such an easy "shortcut". For other colors you will need to specify their RGB/CMYK codes manually. For example, there's no color.orange, but you can use this:

event.target.fillColor = ["RGB", 255/255, 165/255, 0/255];

Notice the values are between 0 and 1, not 0 and 255, hence the division by 255.

[Matt36991512vw7f]

This code is producing SyntaxError: invalid XML name.

if (event.value > 0 && event.value <= 0.25){
event.target.fillColor = color.green;
} else if (event.value >= 0.26 && <= 0.35){
event.target.fillColor = color.red;
}

Are you able to help?

[Nesa Nurani · Accepted solution]

You are missing event.value before <= 0.35