share-cards: social images from one HTML file
Every social site wants a different image size. share-cards turns one HTML design into all of them, with each platform's cropping in mind. It's free on GitHub.
Setting up our social profiles meant making a lot of images. A link preview is 1200 by 630 pixels. An X header is 1500 by 500, with your profile picture covering one corner. YouTube channel art is 2560 by 1440, but phones only show a thin strip across the middle.
We didn’t want to redraw the same design ten times, so we built a tool that does it for us. Today it’s our next open source release.
share-cards
share-cards takes one design, written as an ordinary web page, and saves it as an image at every size you need. It knows each platform’s safe area, the part that’s never cropped, so titles and logos stay in view.
- Nine sizes built in: link previews, X and LinkedIn headers, YouTube channel art, Instagram posts and stories, and profile pictures.
- Your own design: use any fonts, colours and graphics a web page can show.
- One command or many: render a single image, or a whole list from one file.
We built it from the scripts that make the images for every post on this site and on our social profiles. It runs on Mac, Windows and Linux with Node and Chrome, and it’s free under the Apache 2.0 license.
More this month
This is the second of six open source releases leading up to Halloween. Find the rest on GitHub, or sign up for updates.
More from Firedance
-
Mixing smart light brands in one room
Our test room runs on WiZ, LIFX, Govee, GE Cync and Sengled lights at once. Here's what we learned getting different smart light brands to work together.
-
Party lights that sync to music, at home
Lights that move with the music can make a living room feel like a party. Here's what we've learned tuning them in our own test room, song by song.
-
How to sync smart lights to music
We've spent months trying to get smart lights to move with music. Here's what we tried, what let us down, and what finally worked.
