I would like to separate styles (colors) for e-ink Kindles and the rest. It could be quite easy if monochrome or color queries worked. As far as I know, I have to use a workaround. It is said Kindle Previewer does not support queries properly, particularly more complex queries.

I would think these two could do that, however, I am not sure.

For non-e-inks:

@media not amzn-mobi,
not amzn-kf8 and (device-height:1024px) and (device-width:758px),
not amzn-kf8 and (device-height:758px) and (device-width:1024px),
not amzn-kf8 and (device-height:800px) and (device-width:600px),
not amzn-kf8 and (device-height:600px) and (device-width:800px),
amzn-kf8 and (device-aspect-ratio:1280/800) {
/* COLOR VERSION for any device except Kindle e-inks */

For e-inks:

@media amzn-mobi,
amzn-kf8 and (device-height:1024px) and (device-width:758px),
amzn-kf8 and (device-height:758px) and (device-width:1024px),
amzn-kf8 and (device-height:800px) and (device-width:600px),
amzn-kf8 and (device-height:600px) and (device-width:800px) {
/* BW VERSION for e-ink-based Kindles */

2 Answers
2

The preferred solution (and the one I use) is to create default css outside of the media query breakpoints, and then this css will apply to e-ink devices (which don't support media queries -- even the amzn-mobi one, to my knowledge)

You should check the PDF of "Amazon Kindle Publishing Guidelines" on their website. Current version is 2015.4

I think your sample code is fine; my experience has been that it is unnecessary (and cumbersome) to use amzn-mobi in your media query. You can just use generic ones and you'll be fine.

My personal experience is that this breakpoint you listed is unnecessary:

amzn-kf8 and (device-aspect-ratio:1280/800)

I don't have all the devices to test with, but some things I have learned is:

Older e-ink devices also do an admirable job for limited hardware.
The main thing you need to check is image size. The trick is to use high
quality images (1000px or 1500px) in the epub/mobi file and then let
the Kindle website reduce its size accordingly. Don't try to figure
out the algorithm Kindle uses for shrinking images. I used to waste
a lot of brain cells on that. I actually posted my tips on formatting images for kindle devices here: https://kdp.amazon.com/community/thread.jspa?threadID=291039&tstart=15

Kindle for Ipad 1 and the for latest Ipads and Ipad Minis are
relatively similar for the purpose of testing (aside from screen
dimensions obviously).

Thanks. It seems there is no clean way how to do this, the media queries support is really cropped here. As far as I could find in AKP Guidelines, only amnz-mobi and amzn-kf8 are officially supported conditions. Who knows how the rest is treated? At the moment, I can live with that. Hope devs could add broader support in the future.
– Honza HejzlApr 13 '16 at 11:12

1

It would make sense to support a media query that distinguishes between monochrome vs. color, and I wouldn't be surprised if the latest e-eink Kindles do so eventually. . A few years ago I think I did a test ebook comparing colors vs. how e-ink renders colors -- and it helped me to figure out which color combinations to avoid in e-ink.
– idiotprogrammerApr 13 '16 at 19:06

Missing only the Oasis at this time. I tested it across a variety of devices and met with success. Did you test your queries on a physical device, or just the Kindle Previewer?

Note that I would be treating non-e-ink kindles as "default" here, and overriding with this query. If you wanted the stylesheet to be global, you could do non-e-ink CSS in a @media amzn-kf8 query just before this one.