Setting a photo border color based on a variable

I use XM Surveys and CX Dashboards to do market research. At the beginning of each project, we take photos of each participant and we upload those to a web server, so we end up with 01.jpg, 02.jpg, etc. I created an embedded data field that uses piped text to build a url to the image similar to domain.com/photos/01.jpg, where 01 is the piped text for participant ID. The embedded data field is then pulled into a CX dashboard which displays the participant photo. This is all working great.
I'd now like to set the border color of the photo based on the answer to a question on each survey. We ask a series of strongly agree / agree / disagree / strongly disagree questions. With each answer, I'd like to come up with a way to set a variable that I can use to set the border color of the image to show leanings at a glance. For example, I'd like images of participants who indicated strongly agree to have a green border and images of those of strongly disagree to have a red border. This works fine if I hard code the image color in HTML, but I am curious if there is a way to set the image color based on a variable. For example, can a value of "agree" be used to set the border color somehow using piped text, css, or javascript?