Typescale

Typescale

Create stunning typography, generate CSS, find inspiration.

61 followers

✅ Create a cohesive type system for any project. ✅ Iterate quickly and preview changes in real-time. ✅ Get responsive CSS with variables and classes. ✅ Find inspiration, bookmark and clone.
Typescale gallery image
Typescale gallery image
Typescale gallery image
Typescale gallery image
Free Options
Launch Team
Anima - OnBrand Vibe Coding
Design-aware AI for modern product teams.
Promoted

What do you think? …

Jeremy Church
👋 Hey! Jeremy here. I'm a designer, developer, and a billiards enthusiast. Text is at the core of online communications, and it's important for conveying your message. Typescale makes it easy to set up a strong foundation for your project’s typographic system. The scale removes some of the guesswork of choosing text sizes, and helps you create a consistent and coherent hierarchy. Additionally, you can control a slew of settings, iterate quickly, and get immediate visual feedback which helps you see if there are other adjustments you need to make based on your changes. Typescale Pro includes even more goodies. Typescale Pro lets you save your Boards, create responsive scales, generate CSS, explore and bookmark other people’s Boards, and more. Thanks for dropping by. Checkout Typescale, and please let me know what you think!
Jeremy Church
@shivam_tiwari24 Thank you, Shivam!
Olive Haus
Congrats on the launch of Typescale! 🥂 This tool looks amazing. Being able to actually visualize how fonts appear on different device sizes is super valuable to me as a web designer. I can honestly say I bookmarked this immediately and will be referring to it again and again. Thanks for building such a useful, lovely tool! ✨
Jeremy Church
@olive_haus Thanks for your support! Always awesome to hear when people enjoy or find your product useful.
Anthony Green
Typescale is a game-changer for typography enthusiasts! 🌐✨ Creating stunning typography, generating CSS, and finding inspiration in one place is brilliant. Upvoted! How does it simplify the process of setting up a typographic system? Excited to explore! 👏
Jeremy Church
@anthony_green2 Thanks, Anthony! Good question. In terms of CSS it gives you the fonts, weights, heading sizes, and a lot of other typesetting options. For a lot of people and projects, that's probably going to be enough. With the included variables and classes it makes it easy to enhance landing pages. For example adding class text-size-800 to the hero h1, to bump it to the next size up, while maintaining its ideal size on secondary pages. And, with the variables it's easy to extend your CSS by adding new declarations. For example: .eyebrow { font-size: var(--text-size-80); ... } Hope that answers your question, and thanks again for your support!
Anthony Green
@jeremybchurch Wow, that not only answers it but goes above and beyond, Thanks!
Aashish Peepra
@jeremybchurch Your tool will be very helpful for designer's 🌈 Creating killer typography, whipping up CSS magic, and throwing in some inspo? Quick question: Got any favorite font combos or design tips you'd recommend?
Jeremy Church
@aashish_peepra Thanks! Oh boy, that's a tough question, I don't think I could think of a favorite off-hand.
Rami
I don't think I've ever set the font for any of my websites in the past 5 years, lol. I never pay attention to this sort of thing and it probably makes my stuff less professional than it is.
Jeremy Church
@kingromstar Wow. Well now you've got a resource to kick things off. Just be careful though, dabbling in type is highly addictive 🙂👍
Mark Yu
congrats