CODEWITHSUNDEEP
csshtmlcanvas
brian w
brian w

Reputation: 13

Set html5 canvas font color using css

If I want style sheets for different color themes, how can I keep canvas font and line colors in an external CSS file?

I could make hidden dom elements and use them as varaibles.

I could just use javascript to read the current theme and set the colors using javascript variables but then it defeats the purpose of css files. I also want someone else to edit the styles and colors without having to do javascript.

Is there no way to store a setting in a css file and easily read it with javascript (no ajax or jquery)?

Upvotes: 1

Views: 2027

Answers (2)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201896

Canvas drawing is independent of CSS. You set fonts and colors using Canvas API methods, not by CSS styling. The best I can think of as a counterpart to an external CSS file is an external JavaScript file where you just assign values to variables used in your code for drawing on canvas. That file could be made very simple, just assignments, so it would not require any substantial understanding of JavaScript to edit it.

Upvotes: 0

user1726343
user1726343

Reputation:

The line color, etc. in a canvas element are not affected by CSS, so there is no way to directly do this. The best you can do is use a data file of some sort that stores an object in JSON format containing appropriate canvas variable values for each theme.

Upvotes: 1

Related Questions