Fun With Formatting: Text Effects

Popping out of my mole hole again. Have you missed me? (Heh, a very nice blog reader contacted me last week and suggested I’d get a lot more traffic and business if I advertised. True. Except, are you frippin’ kidding me? I already spend 16 hours a day in front of the computer. There’s only one of me…)

Anyway, just for fun, I thought I’d share some cool text effects you can do with html in your ebooks.

colortextNow that’s a screen shot of a page built in Notepad++. It’s pretty close to how the text would look as an ebook displayed on a Kindle Fire or other color ereader.

But what about b/w ereaders, Jaye? Well, considering that an ereader like a Paperwhite or even the older model Kindles display something like 256 shades of gray, color usually translates into something quite elegant and lovely.

bwtextNow, that first line effect (using pseudo-elements) doesn’t work in EPUB readers (yet). The advantage of EPUB readers (as opposed to MOBI) is that they handle embedded fonts far more gracefully than do Kindles. The reason for that is the many different models and the differences in MOBI/KF8. They use different font families and different rendering, so embedded fonts (and such effects as drop caps) can go wonky quickly.

So how is this done? It’s easy in css. Go to the w3schools website for a full list of colors that will render in your ebook. Don’t forget to include the pound sign–#–in front of the color number. Here’s how I styled that page:

html1When using the “first-line” and “first-letter” elements, style the paragraph in a div class as opposed to a paragraph class

<div class=”flblue”>

html2To color just one letter or word, or to increase its size, use a span class:

<p class=”purple1″><span class=”pinkbig”>J</span>aye</p>

That bit of coding, using the above css, would give you my name in purple with a big pink first letter.

If you’re styling your ebook in Word, DO NOT DO THIS. Even though Word will let you do all sorts of fun text effects in your document, I guarantee it will go weird and ugly and broken very quickly when it’s converted into an ebook.

Have fun! Keep making pretty ebooks! If you have any fun text effects you like to use, share.

4 thoughts on “Fun With Formatting: Text Effects

  1. Hmmm, not sure I’ll ever have the opportunity to use color, but it is nice to know that it can be done. I do like the closed/open option. That’s a nifty look. Thanks for sharing.

    • Hi Nila, I love how ebooks look on my Kindle Fire (tablet). Colors render beautifully, so I think using even little pops of color makes a nice touch. For titles and chapter heads, text effects are a good way to make a big impact without using graphics (although I love graphics, too).


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s