Improving sizing and typography in SkeletonCSS

Week 299 was posted by Charanjit Chana on 2023-07-17.

Quick update on my very basic SkeletonCSS project that serves as a base CSS file I can use for future projects. I've been meaning to revisit how I manage fonts and sizing, I decided to move to a fibonacci sequence for sizing and came across an excellent Twitch stream covering great typography in CSS.

I've now updated SkeletonCSS to take advantage of the sizing scheme I chose and lifted some concepts from the video linked to above. At some point in time, I thought I got REMs vs EMs but I lost that over time and am catching up all over again. I had started using pixel values again, but the project now falls back to base sizes at the root level with REMs for fonts and a custom sizing sequence for everything else.

Last of all, this update brings with it an demo page for SkeletonCSS that you can see over at https://cchana.github.io/SkeletonCSS/.

Oh, almost forgot that I also added text-wrap: balance; to headings which should avoid orphans in titles that wrap!

Next up on my list is colour spaces... not sure how I'll bring them into SkeletonCSS or if I need to but definitely something worth exploring.


Tags: css, skeletoncss


Tweet WhatsApp Keep Upvote Digg Tumblr Pin Blogger LinkedIn Skype LiveJournal Like