Gifs and backgrounds


I’m using a .gif graphic to produce some math formulas and they look a bit wacky when I add an extra background to them. If you go to:

(You’ll need to enter username: a and password: a to view the page; I don’t really want robots indexing things at the moment)

then you’ll see that my formula with the light blue background (P(x)=.69x-3000) doesn’t look nearly as good as the other formulas on the page.

Thank you for any possible thoughts!


It’s to do with the anti-aliasing. It looks like you’ve done the original on a light coloured background, a similar tone to the main page background. This means that, even with the anti-aliasing, it looks as intended against the main page background. But place it against a darker, stronger background colour and suddenly you’ve got a load of pale fuzz around the edges, which should help soften it against the background but doesn’t because it’s a different colour.

Two suggestions:

  1. Don’t anti-alias the graphics. They’re a bit too light for me, and it’s not that easy to read them even against the pale background. Making them stronger and darker and with sharper edges will make them easier to read, and will resolve the anti-alias problem.

  2. If you don’t want to go down that route, create this one graphic against a blue background the same shade as the one used in the final page, and that way the anti-aliasing will take on a blue tone.

Another solution is , if available , to use the " matte" setting when exporting as a transparent gif. Use a color for the “matte” that is similar to the or the average of the background where you text will go. this way you still have transparent text, and complex bg can show through… as long as they aren’t extremely dissimilar in average tone.

is interesting that “Apps” have replaced “apples” in math examples.

Thank you both for the suggestions. However, I’m not sure that I have control over the options suggested; the graphics are actually rendered through a site called CodeCogs, which makes it super easy to write out the math formulas, but I don’t actually create the gifs.

As far as Stevie D’s comment:

I’m not quite sure which final page you’re referring to: though if based on what I said above, my best option is to find a different color background, if you could offer some color family suggestions (such as the one on the “final page”), I’d appreciate it.

Thanks again,


PS This is probably one of the first math books to mention apps: I’m trying to write something that students will actually read! :slight_smile:

Sorry if I’m missing something here, but why not just type out those formulae? Even if you want to use images, I would do them in Photoshop, and then you have full control over them.

Even if you use a light bg color on those code boxes (like white) the text is still a bit grainy. The font used is probably too fine to be used with a transparent gif.


Unfortunately, there are actually many other more complex formulae in the website so that Photoshop would only work well for the more basic ones.

Hm, there’s actually a markup language for mathematics. I’ve not tried it, but perhaps it’s worth checking out.

I’ve actually checked it out; most math people (like myself!) prefer to use something called Latex which was not created specifically for the web. However, my guess is that in the next few years (actually I see it happening already), Latex will in fact be an integral part of the web in an html/css sort of way. But for now, with things not perfect, we’ve got to use the tools that we have! So, might there be any other ideas using what I have? :shifty:

Or you could use a variation of TeX such as MimeTeX, which is simple to pick up.

Though to address the initial problem, really and truthfully the best colour set for math formulas is black on a white background. It’s clearer than black on blue and if you get into further maths topics, you’ll want it to be as clear as possible.

Thank you! Maybe I will go with the ol’ tried and true of black on white. Come to think of it, it will be a nice contrast from the rest of the page.


After testing out a white background…I can’t believe that I didn’t think of it sooner. :rofl: