3D Book Image CSS Generator

Dev tools

css generator

SHOW HN2020

638points
87comments
#23of 3,028 in 2020
Top 1%of 2020 by points

How HN took it

MixedNo clear lean

20 positive, 17 neutral or asking, 3 mixed, 12 critical, out of 52 comments about the project. Thread score +0.12.

Execution: 5 for, 10 againstIdea: 9 for, 0 againstDesign: 3 for, 0 againstPerformance: 0 for, 1 againstDocs: 0 for, 1 against

The thread, comment by comment

Each row is a top-level comment and its replies, in HN's order. Select a cell to open that comment on HN.

positive neutral or mixed critical about another commenter or something else the maker

What HN said

What people liked

  • Impressive, nicely done 3D book effect

    From 3 comments
  • Easy to use and useful for authors' websites

    From 3 comments
    • This is a WOW thing! Very cool. Easy to use. Success for you.
      iworkfromhome on HN
    • Impressive! I know a number of people who self publish who will love this.
      zxcvbn4038 on HN
    • I love this so hard. Love the ability to adjust width as well. Great work!
      martyz on HN

Objections

  • Width slider breaks layout and overflows the screen on several browsers

    From 4 comments
    • For some reason the Width parameter is working weirdly in Firefox on Android. Dragging the slider halfway resizes the book to become larger than the whole screen. Screenshot:…
      njsubedi on HN
    • Same for Firefox on desktop. The book gets too wide to fit in its row, and moves down. This causes the controls to change their size as well, which then starts breaking things.
      Deukhoofd on HN
    • My current favorite feature: you can manually override the maximum thickness :] 160px thick book ftw The only comment I have is that the width slider tends to make an…
      exikyut on HN
    • seems to break when you fiddle with the width slider, but it's a nice work never the less
      atum47 on HN
  • Border radius not applied correctly in Firefox and Safari

    From 3 comments
    • radius only apply to the back cover in firfox https://i.imgur.com/nv6locC.png (works as expected in chrome) excellent work otherwise
      LoSboccacc on HN
    • Likewise on Safari. But it's really nice even with that small issue.
      rgovostes on HN
    • radius on front cover doesn't work in firefox
      keithnz on HN
  • Book thickness not corrected for rotation angle

    From 1 comment
    • Nice work. It looks like the book thickness isn't corrected for rotation angle. If you made the horizontal width of the inside pages = thickness * sin(rotation angle) it'll be…
      TheHideout on HN

Requests

  • Calculate thickness from page count

    From 3 comments
    • Cool, very nicely done. Would it be possible to add a different set of parameters that describe the physical book instead? What I mean is specifying the page size in some…
      itcrowd on HN
    • Very cool :) Feature request: can the thickness be a function of the number of pages?
      __ka on HN
    • Do you know the number of pages for each book? Then you could adjust the thickness automatically :)
      lpellis on HN
  • Download the resulting image

    From 1 comment
    • That's brilliant! Is there any way of downloading the resultant image?
      edent on HN
  • Paperback appearance option

    From 1 comment
    • Very nice, I shared this with my sister who will love this, is it possible to make the book have a paperback appearance?
      slimsag on HN

Questions

  • Is it available as a library?

    From 1 comment

Alternatives named

  • diybookcovers.com 3D mockups

    From 1 comment
    • another in this category for multiple devices: https://diybookcovers.com/3Dmockups/ i love collecting little tools like this, lmk if anyone has one for mocking phones, tablets…
      swyx on HN

Category, keywords, summaries and labels on this page were made by AI (Thread Reader v2) and not checked by hand. Each point links to the comments it came from.

Add a badge to your READMEShown on HackerShow
[![Shown on HackerShow](https://hackershow.org/badge.svg)](https://hackershow.org/show/23896856)