Notably, the books are displayed in proportion to their real size (where known and within reason). Where I didn't know the size, the spine width scales with the number of pages. Since I know the dimensions for over 600 books, I had a good source for the factor of pages per cm thickness.

Show thread

The spine colour is derived from the cover colour, so it's easier to find books I'm looking for. Credit for the idea goes to Alex via, though I added a particularly hacky hack to get a better colour selection.

Show thread

The book shelves resize with different browser window sizes fluidly, by the magic of flexbox. Cover images are loaded once you hover on the books so that the main page doesn't throw 600-or-so images at you.

Show thread

All of this was a very productive and good use of my time, and not at all a sudden day-long hyperfocus on a stupid idea I had during breakfast.

Show thread

All that is to say: You can be whatever you want to be, especially if you want to be a yak shaver. You can look around the site here:

Show thread

@rixx I think the color picking from the cover and the width-setting from the # of pages is really cool!

@rixx wow, so cool!
How much time do you spend each day reading?
What did you use for the site - is the source code available somewhere?

@Drops I don't think I did – or I've forgotten about it and it served as subconscious inspiration? :breadthink:

I considered SVG at first, because I use it already for the statistics page:
But the downside is scalability for different page sizes, and that I'd have to do all the boring "fit a box into another box" math, when HTML rendering is pretty good at fitting boxes into other boxes already.

@Drops But looking at your blogpost, I think that I might want to add colour coding via small rings/stripes to show if a book is included in one of my lists!

@rixx ...and I think I will use the linked Idea of getting the main color from the book cover, except, that i think of getting a color for each row of the title cover, so it's more a signature stripe than a signature color

@Drops I considered that, but I think it would be really messy visually. One highlight colour works better to pick out "the book with the red cover", etc. I don't want to drown in visual noise.

@rixx this more pertains to the content on that site than its presentation, but I'm so glad someone else loved *This Is How You Lose the Time War*

@rixx (I hope you don't mind that I sent you a friend req on goodreads)

@acciomath Not at all, though goodreads is currently just the secondary platform that my reviews get pushed to :D
Hope you don't mind the follow request here, always glad to find people with compatible reading interests. No worries if I was overly eager with the request, though.

@acciomath That book *still* resonates. My list of 🌟🌟🌟🌟🌟 books is not terribly long, and this is very very firmly on it.

@rixx I have learned that I am very generous with my 5 star ratings, but I wish I wasn't so I could rate it higher

@acciomath For me, I usually give up to four stars very liberally, and five stars are reserved for books that feel life-changing to me, no matter if I think they are "objectively" or "technically" good. It's a useful system to keep a list of books that are close to my heart.

@rixx I like this idea! I may just go through my ratings at some point and do that

or just add a shelf lol

@acciomath I'm actively terrible about maintaining shelves, though my book site will make it easier and more natural, I hope.

@acciomath Thannnnks! 😍 Took a bunch of work, but it was fun. I worked off the book site of a friend's (, which was a good way to get started.

@rixx How does one reach your 🌟🌟🌟🌟🌟 list? I've browsed around a bit, but couldn't figure out an obvious way to do that. (Other than checking your Goodreads profile, of course.)

@input_sh Oops, good point! I just made a list, and you can find it here: It's a thoroughly weird mix, though. (cc/ @acciomath, who may be interested)

Sign in to participate in the conversation – a Fediverse instance for & by the Chaos community