Studio Snapsize

The Responsinator

denis — Fri, 17 May 2013 21:00:03 +0000

http://www.responsinator.com/

List of Pseudo-Elements to Style Form Controls

denis — Sat, 27 Apr 2013 02:42:30 +0000

http://tjvantoll.com/2013/04/15/list-of-pseudo-elements-to-style-form-controls/

Usability Checklist – Catch common usability problems

denis — Fri, 26 Apr 2013 16:25:44 +0000

http://userium.com/

FontFont Subsetter – Optimize your Web FontFonts

denis — Fri, 19 Apr 2013 20:21:29 +0000

http://www.subsetter.com/

Lighten and Darken Hex Color Values

denis — Thu, 04 Apr 2013 22:12:31 +0000

Ever need to lighten or darken hex values for button hover states? Found yourself having to launch Photoshop or Illustrator just to drag a color picker around? Likewise, one too many times. So, I built a web based tool to do just this, lighten or darken by a set percentage. It’s responsive too so just launch the app on whatever device and use it as you please. Visit the app at hexcolortool.com, bookmark it and share it with all your hipster designer friends.

Define Responsive

denis — Thu, 04 Apr 2013 22:05:21 +0000

http://finecitizens.com/defineResponsive/

Custom Social Sharing Links

denis — Thu, 04 Apr 2013 22:01:24 +0000

Social sharing buttons provided by social networks are usually built to track users, even after they’ve left your site. I know, totally intrusive. Anyhow, there are ways of creating unobtrusive buttons/links to enable sharing on your site. Here’s one of them, in alphabetical order of course:

Delicious - http://del.icio.us/post?url=[URL]&title=[TITLE]]¬es=[DESCRIPTION]
Evernote - http://www.evernote.com/clip.action?url=[URL]&title=[TITLE]
Facebook - http://www.facebook.com/share.php?u=[URL]&title=[TITLE]
Friendfeed - http://www.friendfeed.com/share?url=[URL]&title=[TITLE]
Google+ - https://plus.google.com/share?url=[URL]
Google Bookmarks - http://www.google.com/bookmarks/mark?op=edit&bkmk=[URL]&title=[title]&annotation=[DESCRIPTION]
Linkedin - http://www.linkedin.com/shareArticle?mini=true&url=[URL]&title=[TITLE]&source=[SOURCE/DOMAIN]
Newsvine - http://www.newsvine.com/_tools/seed&save?u=[URL]&h=[TITLE]
Ping.fm - http://ping.fm/ref/?link=[URL]&title=[TITLE]&body=[DESCRIPTION]
Pinterest - http://pinterest.com/pin/create/bookmarklet/?media=[MEDIA]&url=[URL]&is_video=false&description=[TITLE]
Posterous - http://posterous.com/share?linkto=[URL]
Reddit - http://www.reddit.com/submit?url=[URL]&title=[TITLE]
Slashdot - http://slashdot.org/bookmark.pl?url=[URL]&title=[TITLE]
StumbleUpon - http://www.stumbleupon.com/submit?url=[URL]&title=[TITLE]
Tapiture - http://tapiture.com/bookmarklet/image?img_src=[IMAGE]&page_url=[URL]&page_title=[TITLE]&img_title=[TITLE]&img_width=[IMG WIDTH]img_height=[IMG HEIGHT]
Technorati - http://technorati.com/faves?add=[URL]&title=[TITLE]
Tumblr - http://www.tumblr.com/share?v=3&u=[URL]&t=[TITLE]
Twitter - http://twitter.com/home?status=[TITLE]+[URL]

All you need to do is create regular links and replace the contents of the square brackets with the appropriate PHP snippets from your CMS. Style as you wish of course.

collect + share + discover type combinations

denis — Wed, 06 Feb 2013 23:55:56 +0000

http://www.typ.io/

High Quality Photoshop Actions by The Color Shop

denis — Tue, 29 Jan 2013 18:42:38 +0000

http://thecolorshop.co/

Should We Still Use Web Safe Colors

denis — Sun, 27 Jan 2013 19:23:03 +0000

It’s 2013, should we still be using web safe colors? Absolutely not! Long gone are the days where you need to be designing websites that only support web safe colors. But, that doesn’t mean you can’t use them.

I’m mainly just doing front end development these days so most of my work gets handed down to me from other designers. I noticed that a few of them still like to use a limited color palette. Every time I would open one of their Photoshop files I’d notice that the color pickers were set to ‘web safe color’. This got me wondering why they’d be doing this. As it turns out, it’s just easy. There’s not need to be micro-selecting colors from millions of options and the hex values are just easy to remember. The hex values are all set in pairs, like #0099CC. This makes it super easy for me also cause all I need to remember for CSS is #09C. I love easy.

When I searched around the web for ‘web safe colors’ all I found were ancient looking websites with ugly swatch grids. I wanted something nice that displayed all the web safe colors so I built my own. It lives here. It’s responsive so you can just launch this tool on your smartphone or tablet and you don’t always have to flip back to Photoshop. It’s also a super handy tool for filtering through color ranges. Check it out at websafecolors.info