I’d like to present to you my personal project for all designers and typography lovers: typespiration.com.
Typespiration.com is a place where you’ll be able to find inspirational web font combinations along with ready-to-use CSS codes, color schemes and font families.
I came up with an idea for this simple website a while ago. If you read my blog regularly you’ve already seen my previous post “Start The Visual Design Process By Defining The Typography First,” where I explain why I believe that typography is the foundation of any great design.
Who is this website for?
First of all, typespiration.com is not for everyone.
If you’re a designer, this might be a great source of inspiration for your own projects. Some typographical ideas might be the foundation for your entire web design. You can quickly find the fonts that were used in the particular examples, download them and incorporate them into your design project.
If you’re a developer and design is not your best skill, you may find some ready-to-use beautiful typography examples. Simply copy the CSS code and use the suggested colors as a base color scheme. Now you can focus on your development while having a good-looking design theme.
How to use it?
The website is very simple and it’s still in its beta phase. Also, there are not that many typography styles added yet but you can still browse the current ones by going here: typespiration.com.
Choose the style you like and you’ll see the following screen:
- This is a full-width demo.
- Click to see full-screen demo.
- You can quickly copy the entire CSS code of this example by clicking “copy to clipboard.”
- Fonts used in this style. Click on the font to go to the source where you can download it.
- Color scheme of this style.
Are you a designer? Join in!
If you’re a designer, you can join in and share your own typographical ideas. Fill out the “request invite” form and wait for approval. I’ll get back to you with a login/pass to your account within 7 days.
Once you submit your first style, it’ll appear on the home page. You, as a designer, will be listed in the “About” page and your profile (with a link to your Twitter and website) will be listed under each of your published font combinations.
My goal is to create a community of designers who want to share their ideas with others. Being listed on typespiration.com might help you get noticed and build relationships with other designers.
The biggest shifts in my life and career happened after Brian Gardner found some of my projects on one of the CSS galleries. Don’t miss your chance!
What’s next?
I’m planning to keep that website very simple and easy to use.
Once there will be more styles added, you may expect some extra “search” functionalities that will help you find the right font combination.
Also, I’m planning to have some exclusive bonuses for all registered designers. It’ll be worth it to be a part of this project!
Special thanks to Jason Weaver and Jonathan Perez for their initial feedback that helped me make this website better.
Jared Williams says
Love the project! I can’t wait to see what this site becomes. Great job!
Rafal Tomal says
Thanks Jared!
Carrie says
Rafal, you continue to deliver awesomeness. I’ve loved using your Wireframe kit since you introduced it and the typography inspiration site is total icing on the cake. Thanks!
Rafal Tomal says
Thank you Carrie!
I’m glad you found the Wireframe kit useful 😉
Ramona says
This is exactly what I’ve been looking for. Thanks and keep up the great work!
Ramona
Rafal Tomal says
Thanks Ramona!
Philip Gledhill says
Hello Rafal
“Keep that website very simple and easy to use”!
Many web sites are simply one person communicating with their audience.
Making it easy for your customers or audience to understand your message is very important. Many designers get so wrapped up in “design” that they forget about communicating.
If anything makes it easier to put your message in to my brain, so I really know what you meant to say, and “get it”. That’s a fantastic thing.
Thanks for the font combinations or layouts you’ve provided so far. If you and your blog members can provide more ways to transfer information or knowledge from your brains to mine, I’d be truly grateful.
Thanks
Philip Gledhill.
Rafal Tomal says
I like your thoughts about web design. That’s why what we do is called “visual communication”.
Chad Pierce says
I would be very interested in adding some types that I like to use to this set. seems like a crazy cool idea.
Rafal Tomal says
Sure thing. Send me your invite request and give me couple days to get through this. I already have over 20 requests and noticed a few things I need to fix on the website 🙂
Jess Ostroff says
Congrats, Rafal! I love seeing everything that you’re working on (although I don’t know how you find the time to do it all)! I think it’s so important to keep beautiful design at the forefront of people’s minds and I’m so glad you’re perpetuating that 🙂 Best to you and typespiration!
Rafal Tomal says
Hey Jess,
I can’t believe I find time to do this too but I enjoy it 🙂
Thanks for stopping by!
Rizqi Fahma says
Nice website with awesome design, Rafal 🙂
Rafal Tomal says
Thanks Rizqi!
Roberto Gomez says
I could not resist the urge to leave a contribution and I found a wonderful experience, I am waiting to know, how you built the website?.
Rafal Tomal says
Robert,
Here is my another post in this subject: http://rafaltomal.com/making-of-typespiration-com/
Colleen Conger says
And this is why I subscribe to your blog! Typespiration.com is like COLOURlovers on crack! I just submitted my invitation request 😀
Being a self-described font addict, I’ve found that the only “true” way to get the text/font I want to use to look perfect on a website is to create a graphic. Revision and updating became a chore. Now, thanks to your new site and its talented designer contributions, I’ll be able to do what I want with no fuss, no muss. Super excited to see what you and the designers come up with next 😀
Taposy Rabeya says
This is an amazing project. I absolutely love it.
Thank you for sharing the blueprint and its end product –typespiration.