Set value to math in JS?

Question

function myFunction() {
var var1 = 5;
var var2 = 50;
var var3 = 100;
document.body.style.backgroundColor = "#" + (255-var1) + (255-var2) + (255-var3);
};

How can I convert the value inside the parentheses to hexadecimal value?
Ultimately, the value would be #FACD9B (Just an example)
Thank you in advance!

It sounds like you're actually asking how to convert to hexadecimal. — SLaks, Apr 17 '15 at 01:59
`How can I make it do the math` You've done the math.. by executing `255-x` inside the parentheses. right? :) — Willy Pt, Apr 17 '15 at 02:00

score 4 · Accepted Answer · answered Apr 17 '15 at 01:59

4

"#" + (255-var1).toString(16) + (255-var2).toString(16) + (255-var3).toString(16)

answered Apr 17 '15 at 01:59

Farzher

13,934
21
69
100

1

you ask the provided number to be converted to `base16` – Willy Pt Apr 17 '15 at 02:05
1

@Dr.Owning Because hexadecimal is base 16. Instead of 10 it'll show `a`, then for 11 show `b`, etc – Farzher Apr 17 '15 at 02:05
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toString see this for reference – Willy Pt Apr 17 '15 at 02:07

score 4 · Answer 2 · answered Apr 17 '15 at 01:59

4

You could use rgb instead of hex color codes in order to make it particularly simple, as well.

document.body.style.backgroundColor= 'rgb(' + (255-var1) + ',' + (255-var2) + ',' + (255-var3) + ')';

answered Apr 17 '15 at 01:59

JBzd

715
3
12

score 0 · Answer 3 · answered Apr 17 '15 at 02:02

If you're trying to create a color via three variables, what you want is probably RGB format (x, y, z), not hex (#xxxxxx). So it'd be something like:

document.body.style.backgroundColor = 
"rgb(" + (255-var1) + "," + (255-var2) + "," + (255-var3) + ")"

which would output something like

"rgb(247,205,155)"

which is a valid way to declare a color in CSS/HTML.

score 0 · Answer 4 · edited May 23 '17 at 12:06

0

Check this answer

Which tells about the rgbtohex function by @Tim Down

Use it like this

document.body.style.backgroundColor = rgbToHex(var1, var2, var3);

edited May 23 '17 at 12:06

Community

1
1

answered Apr 17 '15 at 02:03

Gareth Alined

1
1

Set value to math in JS?

4 Answers4