Base 16 Color Schemes


When you write code it’s important to do it in a comfortable environment. I have spent a ridiculous amount of time looking for a color scheme that works for me and I think I finally have a winner: Base 16 (Eighties).

Screenshot of Sublime Text using Base 16 Eighties

Typography Cheat Sheet


I’m a fan of cheat sheets, I use them all the time at work. This one is a comprehensive guide to using proper typographic characters, including correct grammatical usage, keyboard shortcuts and HTML entities.

Primer, another CSS framework


GitHub publicly released their internal CSS framework… and definitely, you can tell that the Bootstrap: guys now work for GitHub. Not necessarily a bad thing, though, and the docs are always interesting so it’s worth taking a look.

How they got there


Khoi Vinh, designer and blogger at, interviews digital designers about their careers. Because no one teaches you how to build a design career, it’s interesting to see how these industry-leaders did it… and it’s fun to see how luck and coincidence played an important role for them too.

Designing a Windows 8 app


Recently I had to design my first Windows 8 app. It ended up being fun, but the lack of resources and documentation (specially if you compare with iOS and Android) turned this into a challenging experience. Well I wish I had found this blog post before. Designer Katie Riley writes about her process and frustrations designing for Windows (pretty much the same ones I had) and she also shares some free resources, including an amazing Sketch app template.

Website Style Guide Resources


In the last few months I’ve been posting links about front-end style guides and related resources. Well, this one has them all. It’s an extensive collection of articles, books, talks, tools and even podcasts about style guides and pattern libraries. I think one of these days I’ll write a longer post about how we wrote the style guide that we use at My Big Campus.

Random User Generator


This site generates random user data that you can use in your projects (everything is released under a Creative Commons license). You can also get this info using an API, a Photoshop extension or a Sketch extension.

Proteus, starter kits for your static site


If you use a static site generatork like Jekyll or Middleman, Proteus will help you get up an running. It’s a collection of starter kits that will give you a basic foundation for your site: HAML + Coffeescript + Sass + Bourbon + Neat + Bitters… That’s pretty much the same setup I use. If you use Serve instead of Jekyll, this Serve Project I forked a few months ago uses the same components except Bitters.

My Setup


I wanted to talk about some tools I use so I wrote down a list that I called “Nerd Fun Tools”, but then I found this blog full of nerdy interviews with people talking about stuff they use. I think that’s a better format than just writing a trillion nerdy posts about similar stuff, so I’m going to pretend I’m interviewing myself and I’ll talk about stuff I use.

Who are you, and what do you do?

Hi, my name is Carlos Cuéllar and I design e-learning products for K-12 schools at Lightspeed Systems. I’m a Spaniard living in Portland who enjoys caffeine, live music and Formula 1 races.

What hardware do you use?

My laptop is a 2012 Macbook Pro Retina with 500Gb SSD, 16 gigs of RAM and a 2.7Ghz i7 processor. It’s the best computer I’ve ever had and I think I might keep it for another year or two. When I’m at the office, I connect my laptop to a 27" Thunderbolt Display, a wired Apple keyboard and a trackpad. It’s a nice setup but I really want Apple to retinize the Thunderbolt Display.

My Macbook Pro

I use a Time Capsule as a global backup solution and sometimes I use SuperDuper! to clone my laptop’s drive in an old external hard drive. I don’t use Crashplan or any cloud-based backup service because I keep most of my files in Dropbox, Google Drive and GitHub. Hopefully that should be enough protection!

I like to occasionally steal my wife’s laptop (please don’t tell her!), a 2013 Macbook Air, and my mobile devices are Apple-made too: an iPhone 5S and an iPad Air. You would think I’m an Apple fanboy, but I really like some Android smartphones. I would never buy any other tablet than an iPad though.

At home, I have a dumb Toshiba LED TV that is connected to a 3rd generation Apple TV and a Teac MC-DV600 receiver. The Apple TV is getting dated but it’s still great for me. I use Airplay all the time to mirror content from video apps, Netflix and Amazon Prime Video feed me with more content than I can actually watch, and the Podcast and Radio apps are just great. I would probably use a Raspberry Pi with XBMC if I was in Europe, but here there’s no need for it. The Teac receiver is not too fancy (I really need to upgrade those bookshelf speakers), but its secret weapon is a multizone DVD player that lets me watch movies I purchased in Spain. I also have an Audio-Technica AT-LP60 turntable, a Logitech UE Boom wireless speaker and I recently ordered the new Amazon Fire TV Stick but I won’t get it for another two weeks.

And what software?


Sketch 3 has become my main design tool: I use it for wireframes and also for more polished mockups. Then I create and share clickable prototypes with InVision, which is one of the most useful web-based tools a designer can use.

Sketch 3

When I need to edit bitmap files I still open Photoshop, but I’ve never been a fan. I was a Fireworks user for a long time and when Adobe started neglecting it I switched to Illustrator which kind of worked for me (it’s still as bloated as Photoshop). Recently Sketch gained traction in the design community and I was happy to switch.

I also use many smaller tools like ImageOptim to optimize image compression, xScope to measure things on screen and mirror mockups in mobile devices, Sip to pick colors on screen, and Preview for almost everything else. Seriously, Preview is a powerful piece of software that is often underused.


Google Chrome is my default browser and when I try to switch to Safari or any other browser I always come back to Chrome because of the developer tools and plugins. Sublime Text 2 is my favorite text editor and similarly, when I try any other editor I always end up back in Sublime because it’s faster and it has more and better plugins. For Git purposes I use Tower and as most designers I use the Terminal only when it’s strictly necessary (start and stop servers, update stuff and not a lot more). Forklift is my FTP client but I rarely use FTP anymore, and I use VMware Fusion when I need to run Windows and check things on Internet Explorer.


I use Alfred like 50 times a day. It helps me save time doing custom web searches, starting local servers, checking the weather, sending todo items to Trello, expanding text… It’s similar to Quicksilver but without the learning curve. I also use BetterSnapTool to arrange windows in my screen and 1Password to save… yes, passwords. I manage my todo lists with Trello, all my emails are stored in a Google Apps account and I also store things on Dropbox (at work) and Google Drive (for personal stuff). Evernote helps me take random notes, keep snippets of code, and store screenshots of websites and things I like, but I’m looking for an alternative. Maybe I’ll give OneNote a try soon.


At work we use Slack for messaging and I use Skype when I need to call someone in Europe. I have a 20,000 songs collection that I keep in iTunes Match and sometimes I listen to iTunes Radio because it’s included in my iTunes subscription and it doesn’t have commercials, but it’s not great. Instapaper is my read-it-later thing and I check blog articles and news on ReadKit (mac) and Unread (iPad). Readmill used to be my default ebook reader, but now that it’s closed I have to use iBooks.

What would be your dream setup?

I’m happy with my current setup. As I said before, I’m waiting for the day that Apple announces new Thunderbolt Displays and Apple TVs, and I also think that I will buy a new receiver when we move to a bigger house. And about the software, I’m always trying new stuff. The goal is to try to simplify things and find smoother workflows, but that’s not always easy.

Junecloud Automator Actions 3.0


This collection of Automator actions is a must for me and it is one of the first things that I install in every mac I use. Some of the things that you can do with them are saving images for web (using Photoshop or Preview), make file names web-friendly, create clean archives, symbolic links and more.