- Purify CSS
- Email Lab
- Layers for WordPress
- Font Library
- First-aid Git
- Angular Interactive box-model Diagram
- CSS Gradient Animator
- Epic Favicon Generator
- UX Recipe
- Visual Help guide to CSS3 Flexbox Qualities
- CSS Font Sizing
- Typography Cheatsheet
- Device Metrics
- CSS Ruler
- PixelCounter Application
- Web Font Load
- …and finally…
CSS Stats is a straightforward web-based application that visualizes various stats regarding your CSS files.
With HTTTML you are able to improve your boring, standard markup, to incorporate custom tags with increased intriguing and unique names.
Purify CSS is really a handy tool that detects which CSS selectors your application is applying and helps to create personal files without unncessary CSS.
Email Lab is definitely an open-source starter package for HTML emails that utilizes Grunt, an order-line build tool, to streamline and simplify the development of email templates. The templates could be constructed with re-functional components and could be styled using traditional CSS or Sass
Layers for WordPress
Lately reaching the 100,000 download milestone, Layers is really a new and open-source site builder for rapidly creating WordPress styles.
spaceBase is really a Sass-based responsive CSS framework that may be built upon and tailored for your needs. It combines guidelines for today’s responsive web using the core components utilized on every project.
Font Library is definitely an open-source project to tag, organize making it simpler to browse Google Fonts.
.resizr emulates the various screen sizes of numerous popular devices demonstrating the way your site can look and permit you to test media queries.
Libraries.io is really a web-based application that can help you discover new open-source libraries, modules and frameworks as well as keep an eye on ones you rely on.
First-aid Git is really a searchable collection of the very most frequently requested requested questions regarding Git.
Angular Interactive box-model Diagram
A helpful application that will help you visualize this area-model.
CSS Gradient Animator
CSS Gradient Animator is, as suggested by its name, an opportune little tool for rapidly generating CSS gradients.
localFont is definitely an web-based Vanilla JS tool that converts font family files right into a available solution for localStorage web font caching.
Epic Favicon Generator
Epic Favicon Generator is really a tool and build 20 different favicon sizes for the site, from 16x16px completely as much as 196x196px.
UX Recipe is really a listing in which you uncover, choose and estimate the next UX project tools & techniques.
Visual Help guide to CSS3 Flexbox Qualities
Rather that explaining the way the flex qualities work, this visual guide concentrates on the way the flex qualities affect layouts.
CSS Font Sizing
CSS Font Sizing explores and blogs about the various ways of declaring font sizes with CSS.
This Typography Cheatsheet, produced by Type Wolf, is really a comprehensive help guide to smart quotes, dashes & other typographic figures.
Device Metrics is really a handy resource from Google The perception of examining the display size, resolution, aspect ratio of numerous devices.
CSS Ruler is really a handy web-based tool for exploring CSS lengths.
Unitools is an accumulation of tools, collected from various sources around the internet, for dealing with Unicode within the browser.
Pixelcounter is definitely an free Home windows and Mac application for counting the pixels of the images.
Web Font Load
Web Font Load is really a tool that will help you to install, through the terminal, All Google’s Web Fonts at the same time.
ai2html is definitely an open-source script for Adobe Illustrator that converts your Illustrator documents into HTML and CSS.
…a couple of handy references for you personally:
- htaccess Cheat Sheet – An accumulation of helpful .htaccess snippets.
- HTML Arrows – HTML Symbols, Entities and Codes.
- GitHub Cheat Sheet – A summary of awesome options that come with Git and GitHub.
Feature image: dotshock
Useful Free Mac Tools & Apps | Tech for Designers
Lauren Fairweather: These would help me so muchhhh!! Thank you for sharing them!
Jaylen Fast: You should consider running ads for an income, the people who seriously hate ads (like myself) already have methods of blocking them, while the people who dont care…just dont care.
Stephanie Noel: One great tool that I use is called Grammarly. I think it's useful for proofreading anything I write online and is way better than just Spellcheck. It is not really a design tool but as a designer, I think have great grammar is important.
Nouf b: I don't know why but I am in love with your hair 😍
Abi Knee: These were really useful, thanks charli! I do think it's a shame that you don't run ads though. As an audience, watching your videos is for our consumption, but by earning via the ads, we also "give something back" to you, just by watching them. I understand that you are directing to your online shop but I bet it is really hard to get people to part with their money!!!
Kaylin Murray: Thanks for the app suggestions! I will have to check them out!! I use Spectacle everyday it is a SUPER EASY way to spilt your screen.
JustKevYTP: Amazing, Charli! The main two tools I use are "caffeine" and "albert" for my macbook.
Richard Alscher: Hey there, just stumbled across your channel and I am very glad I did. I'm not much of a designer, more a backend programmer, but I do find my self in situations where the stuff you are talking about is quite usefull to me, so thanks a lot!\n\nBut I also just wanted to point out that Sip is no longer free, it's a 14 days trial and then 9.99$ version now.\nI was also quite pleased to see what toggle can do, but I am not a fan of signing up for a free app, so I have to keep looking.\n\nCheers
Mihalca Danut: Similar to paparazzi app, fireshot works on windows machines in the exact same way! Look for it the Chrome store, or just search on Google.
Jaime León Betancourt: You should try Yoink, Downie, Miro Video Converter, Pocket, The Unarchiver, Gifox. \n\nThanks for Paparazzi!