Menu Search
Jump to the content X X

The Smashing Email Newsletter

We love useful stuff, and we love quality writing, that’s why we send out an editorial email newsletter twice a month with useful tips, tricks and resources for designers and developers — thoroughly collected, written and edited by us exclusively for our readers. Once subscribed, you’ll receive a small token of appreciation — a free eBook just for you.

Mailchimp Subscriber Count /

Of course, you can cancel your subscription at any time (just check the “unsubscribe” link in the footer of the last newsletter issue). The Smashing Newsletter will always be free of charge. We respect your privacy; we will never give your data to third parties, nor would we ever spam you. You have our word!

Please keep in mind that we keep the number of ads per issue to a minimum; and to help us cover our costs, we send out at most one monthly special issue which is dedicated to Smashing projects and products. We appreciate your support, and we’ll make sure to keep your subscription worthwhile.

If you’re looking for older issues of the Smashing Newsletter, we’ve prepared all of them in a downloadable ZIP file12 (226 MB) for you starting from Issue #14.

Last Newsletter Issue #175

This newsletter issue was sent out to 234,002 newsletter subscribers on Tuesday, February 7th 2017.

Not all websites are created equal. While experimental interfaces are out of place most of the time, they are more than welcome on websites that convey a character, a personality, and a unique point of view. That’s not just true for art-directed pages, personal portfolios or design agencies13 though. Music bands14 and art exhibitions15 can benefit from it as well.



With Smashing Magazine’s upcoming relaunch18, we had to rediscover and redefine our personality, and as a part of it, discover and highlight what we call a signature. That signature doesn’t have to be overly prominent, but it should be noticeable and consistently delightful. In our case, Dan Mall had chosen to use the tilting of our logo in obvious and not-so-obvious places, even at risk of having it appear too playful at times. Let’s see where you’ll be able to spot it! ;-) Expect a little surprise very soon.

Looking for strategies to balance out the creative with the relevant? Well, that’s one of the themes at our upcoming SmashingConf San Francisco19, taking place in April. With lots of opportunities for networking, speaking and getting better at your craft — be it front-end, UX, or anything in-between! Just check the speakers line-up20. Well, I hope to see you there!

Find your signature.
– Vitaly (@smashingmag)

Table of Contents

  1. A Notebook That Follows You Through Your Browser Tabs21
  2. Are You A Master Of The Command Line?22
  3. Delightful Effects For Text Input Fun23
  4. Monochromatic Eye Candy24
  5. Implementing “Save For Offline” With Service Workers25
  6. Good (And Partly Free!) Reads For Your Digital Bookshelf26
  7. Could You Afford Living In The City Of Your Dreams?27
  8. A Magic Button For Shopping28
  9. Superheroes To The Rescue!29
  10. Taking Visual Experiences To The Next Level30
  11. Upcoming Smashing Workshops31
  12. New On Smashing Job Board32
  13. Smashing Highlights (From Our Archives)33
  14. Recent Articles On Smashing Magazine34

351. A Notebook That Follows You Through Your Browser Tabs

Staying focused can be hard when you’re having a stressful day. Maybe you’ve tried to jot down reminders and to-dos to structure your thoughts and ideas to prevent you from getting lost. But when you forget to look at them because you’re either too absorbed in your work or because you’re constantly getting distracted, well, then the best notes are useless, too. The Chrome extension Mindful36 attempts to change just that.


Created by Adrian Zumbrunnen, Mindful gives your thoughts, ideas and ongoing tasks a new place. One that you always have in sight anyhow: Your browser. Whenever you open a new tab in Chrome, Mindful will make sure that your notes are right there. It’s not a fully-fledged writing suite, but that’s not what it’s about. Instead, Mindful tries to relinquish any additional distraction and lays its focus on simplicity so you can focus on the things that really matter: Your ideas. (cm)

382. Are You A Master Of The Command Line?

You know the high-striker at the carnival that lets you test your strength? Well, the Command Line Challenge39 is something like that for developers. It’s not about muscle strength, though, of course, but your iron command line skills.

Commandline Challenge40

The challenge: You get a row of tasks that you need to solve with only a single line of bash. Extracting all IP addresses from certain files, for example, or printing the nth line in a given file. There are 30 tasks in total for you to master before you can call yourself a real command line hero. Ready to take on the challenge? (cm)

413. Delightful Effects For Text Input Fun

Filling out a form is nobody’s favorite task. But actually, it doesn’t take a lot to enhance the experience. Just add a sprinkle of surprise and a seemingly dull interaction suddenly becomes a lot more delightful. To cater for some inspiration on how this can be done, the folks at Codrops put together some innovative text input effects42.

Text Input Effects43

What they all have in common is that they use CSS transitions and subtle animations to cater for some unusual effects once a user clicks on an input field: It’s either the position of the field label that might shift, borders will become animated, or colors will change. Keep in mind that animating the text input has bugs on iOS and Internet Explorer (the cursor of the input won’t move until you actually type). Nevertheless, a fantastic source of inspiration. (cm)

444. Monochromatic Eye Candy

Who doesn’t love some good eye candy? If you need some fresh inspiration, be sure to stop by the Tumblr of The Afrix45. Curated by designer Tom Wysocki, the Tumblr resembles a well-balanced exhibition of opposites — black and white, strict geometry and fluent, organic shapes — joining up to build a harmonious whole.

The Afrix46

Among the works, you’ll find actual designs for portfolio websites and detailed illustrations, but also rather abstract and seemingly random digital experiments. It’s that mix of the unforeseen that makes the showcase so refreshing despite its monochromatic color palette. Beautiful works of art with a mysterious touch. (cm)

475. Implementing “Save For Offline” With Service Workers

You probably too know the moments when you’re on the subway, reading an article, and suddenly your cell connection breaks down. To prevent her users from the unpleasant effects that a flaky connection brings along, Una Kravets recently added a small but mighty feature to her blog: An option that allows users to save blog posts for offline reading. Luckily for the rest of us, she wrote up a post explaining in detail how you can do it48, too.

Implementing Save For Offline With Service Workers49

The idea behind Una’s approach is to give users the choice which articles they want to save for offline reading instead of automatically taking up precious space in their cache without asking. Thus, her solution relies on a trigger element (a little download button which is positioned next to each article’s heading) that gets the service worker magic rolling. Clever! (cm)

506. Good (And Partly Free!) Reads For Your Digital Bookshelf

Do you need some new reading material? Then we might have something for you. We stumbled across a few free eBooks lately that are bound to take your skills to the next level. One of them is the Site Reliability Engineering: How Google Runs Production Systems51 book. In it, Google’s SRE team gives insights into how their engagement with the software lifecycle has enabled Google to build, deploy, monitor, and maintain some of the largest software systems in the world.

The UX Library52

If you want to improve your JavaScript know-how, well, then Dr. Axel Rauschmayer’s book collection is for you. He offers all of his four JavaScript books for free online reading53 so you can dive deeper into the ins and outs of ES5, ES6 and even the latest ES2016 and ES2017 versions. Last but not least, a resource that isn’t free, but very handy when you’re on the hunt for some good web design books, is the selection which UXcellence54 curates on a wide range of topics from content strategy and copywriting to product strategy, interaction and responsive design. Happy reading! (cm)

557. Could You Afford Living In The City Of Your Dreams?

When we travel abroad, we are often surprised, sometimes even a bit shocked, about what certain things cost in other countries. Drink a beer in Denmark, for example, and you’ll have to pay something around $6.50. Drink one in Germany: $3.75. Costs of living differ. Sometimes a lot. Not only between countries but even cities. But what if you decided to move? Would you get by with your current income? Or would you need to make more to maintain your current standard of living?


Luckily, it doesn’t take rocket science to find out: citii.io57, a small React app built by Hassan Djirdeh, will do the calculations for you. It uses the cost-of-living index attributed to Russian economist A. A. Konüs, paired with up-to-date data gathered from Numbeo58, a database of user-contributed data about any kind of aspect of our lives. Just enter the city you’re currently living in, your annual salary and where you wish to live, and the app will tell you the equivalent you’ll need to make to keep up your standard. Insightful. (cm)

598. A Magic Button For Shopping

Some little helpers are so genius that you start to wonder how you could ever get around without it: Wikibuy60 could be one of those. Available for Chrome and iPhone, Wikibuy attempts to change the way you shop — by providing you with the best deals from all over the web whenever you browse Amazon or scan a barcode.


In fact, while you browse a product on Amazon, it takes Wikibuy only 15 seconds to evaluate other vendors, among them Walmart, Target, and eBay and check if your desired product is available somewhere at a lower price. It then automatically confirms availability, price, taxes and shipping, and even tests for coupon codes and applies the best one at checkout. When you accept an offer, you pay Wikibuy, and they’ll track the order for you. An interesting concept. (cm)

629. Superheroes To The Rescue!

Let’s be honest, have you ever actually read the iTunes Terms And Conditions before you clicked “Accept”? The entire wall of text? 96 pages of legal speak? Well, you can’t be blamed. We did neither. But a superhero now comes to the rescue, on a quest to make the T&C less boring. His name: R. Sikoryak. Profession: Cartoonist. And well, he’s got some mighty helpers to join him, among them X-Men, the Transformers, Snoopy, Tin Tin, Dilbert and even the Smurfs.

iTunes Terms And Conditions: The Graphic Novel63

What sounds like a weird dream are the ingredients for iTunes Terms And Conditions: The Graphic Novel64. Yes, R. Sikoryak did illustrate the entire legal document, word for word in the style of classic cartoon strips. And what came out of it is not only pure eye candy but also a stellar example of how some unexpected turns and a pinch of wit can transform something boring into a captivating experience. Hats off! (cm)

6510. Taking Visual Experiences To The Next Level

Websites are more than just a reference for folks to find more information about a company, service, person or project. Web developers and designers are aware of this fact, and have been busy trying out new ways to provoke the visual experience. For example, an Austrian interactive agency WILD brought Falter Inferno66 to life in order to express “a ride through today’s living hell”. Very impressive — we’re sure you’ll agree.

Visual Experiences67

There are other impressive websites that have been developed with animated video masking which include mix-blend-mode in CSS. Not only that, but it’s fully responsive68, too. There are even those that have audio as well as animation developed with a combination of HTML, CSS, JavaScript and WebGL. For Honor69 is a brilliant example. You won’t know where to look first. (il)

7011. Upcoming Smashing Workshops

With so many techniques, tools, style guides, design patterns, strategies, abstractions, frameworks and boilerplates available nowadays, what do you really need to know to keep your workflow fast, smart and efficient? That’s exactly what our classes are all about: practical front-end and RWD workshops that will help you become better front-end developers and designers, today.

Smashing Public Workshops71

Workshops at SmashingConf SF 2017 — Apr 3

Workshops at SmashingConf SF 2017 — Apr 6

Our Public Workshops

Or, if you’d like to run an in-house workshop at your office, feel free to get in touch with Vitaly at vitaly@smashingconf.com84 and briefly describe what problems you’re facing and would like to solve. Don’t worry about the costs — we’ll find a fair price for sure. Get in touch — it’s that easy!

8512. New On Smashing Job Board

Here are the recent job openings published on our Smashing Job Board86:

  • Programmer/Analyst — Web87 at Duncan Aviation (Lincoln, NE)
    As a Web Programmer/Analyst I, you will be part of a team that is passionate about learning and applying new technologies to create innovative solutions.
  • React Engineer88 at FoxCommerce (Remote – Russia, Ukraine, Poland)
    FoxCommerce is seeking a UI Engineer with the hunger to be more than just a cog in a giant machine. This is the perfect role for a technical leader that cares deeply about their craft.
  • Web Application Developer89 at Quartz (New York City, NY)
    Developers at Quartz may be called upon to work on any part of the site, rather than adhering to the usual labels of “front-end” and “back-end”. You should be comfortable adding a module to our Backbone.js application, building a custom WordPress plugin, or writing a hardware-accelerated CSS transition.

9013. Smashing Highlights (From Our Archives)

  • Transforming Lufthansa’s Brand Strategy: A Case Study91
    This case study sheds light on how the team at Frontify worked with Lufthansa to create a living style guide (including for UI component libraries) and to manage its design and web projects. Their undertaking was to conceptually advise Lufthansa on how to create a style guide and UI library and how to use both in its design-to-development collaborations.
  • An Exploration Of Carousel Usage On Mobile E-Commerce Websites92
    Does this title make you skeptical? Our author Kyle Peatt would have been too before he saw the research that led to this article. Ask anyone and they’ll tell you that carousels are an anti-pattern. Don’t use them. But maybe it’s not so cut and dry.
  • 60 Stylish Round Icons – Meet The Roundicons93
    Everyone loves a good, clean and simple icon set, so we’re honored to present to you a set of 60 vector round icons which was cleverly designed by the creative trio at Roundicons and released exclusively for Smashing Magazine and its readers. Crafted with great attention to detail, this icon set is extremely easy to use and will most probably be the next ultimate resource for any one of your design projects.

9414. Recent Articles On Smashing Magazine

Design Articles

Coding Articles

Inspiration, Freebies, Misc.


  1. 1 #newsletter-issues
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16 ###
  17. 17 ###
  18. 18
  19. 19
  20. 20
  21. 21 #a1
  22. 22 #a2
  23. 23 #a3
  24. 24 #a4
  25. 25 #a5
  26. 26 #a6
  27. 27 #a7
  28. 28 #a8
  29. 29 #a9
  30. 30 #a10
  31. 31 #a11
  32. 32 #a12
  33. 33 #a13
  34. 34 #a14
  35. 35 #
  36. 36
  37. 37
  38. 38 #
  39. 39
  40. 40
  41. 41 #
  42. 42
  43. 43
  44. 44 #
  45. 45
  46. 46
  47. 47 #
  48. 48
  49. 49
  50. 50 #
  51. 51
  52. 52
  53. 53
  54. 54
  55. 55 #
  56. 56
  57. 57
  58. 58
  59. 59 #
  60. 60
  61. 61
  62. 62 #
  63. 63
  64. 64
  65. 65 #
  66. 66
  67. 67
  68. 68
  69. 69
  70. 70 #
  71. 71
  72. 72
  73. 73
  74. 74
  75. 75
  76. 76
  77. 77
  78. 78
  79. 79
  80. 80
  81. 81
  82. 82
  83. 83
  84. 84
  85. 85 #
  86. 86
  87. 87
  88. 88
  89. 89
  90. 90 #
  91. 91
  92. 92
  93. 93
  94. 94 #
  95. 95
  96. 96
  97. 97
  98. 98
  99. 99
  100. 100
  101. 101
  102. 102
  103. 103
  104. 104
  105. 105
  106. 106
  107. 107

↑ Back to top Tweet itShare on Facebook

The Smashing Editorial prepares bi-weekly newsletter issues with lots of love and appreciation for the good ol' web with the latest tips and tricks for designers and web developers. Vitaly Friedman, Smashing Magazine's editor-in-chief, started this project back in early 2010. Today, we can't imagine a better way of informing and communicating with our fans and readers!

  1. 1

    I’ll subscribe

  2. 2

    Nice and useful!

  3. 3

    done deal.

  4. 4

    Rudra Ganguly

    April 21, 2010 6:19 am


  5. 5

    I’m there :)

  6. 6


    May 17, 2010 4:32 am

    have subscribed…. now let’s see…. how useful is it? I’ll be patient…

  7. 7

    It is really awesome to have all these issue. I am enjoying a lot, thank you very… very much.

  8. 8

    Richard Diamond

    June 5, 2010 4:38 am

    I am trying to subscribe to your newsletter which was forwarded to me by a friend. You need to “confirm my address by having me click on the link in the email you just sent me”, but that is not clear, and does not seem to work for me. Can you help?
    Thank you.

    • 9

      Vitaly Friedman

      June 27, 2010 4:22 am

      Exactly. You should receive an e-mail with a confimation link. Once you clicked on it, your subscription will be confirmed and you will receive the next issue of the newsletter.

  9. 10

    Of course !! :)

  10. 11

    One of my favourite newsletters. I look forward to it every fortnight!

    Keep it up guys :)

  11. 12

    thank you for being so useful, cheers :)

  12. 13

    I like it a lot, so much so I forward your recent newsletter to a couple of friends who I’m sure will sign up for it also!

  13. 14

    Smashing is one of the best magazine i have ever come across. Thanks, i lyk it guys.

  14. 15

    I just found out about this and I’m so excited! Thanks.

  15. 16

    Yay, Subscription Confirmed! :D

  16. 17

    Speaking of good design, enjoyed the article, but it’s not easy to print. You may want to think of having a print icon at the top and bottom of the article/ print friendly version that doesn’t include the comments. Great work on the content though.

  17. 18

    Subscription done..You are really good to miss out..:)

  18. 19

    On holidays at the moment and stumbled over your website while reading up on colour theory it’s fantastic thank you! Cheers

  19. 20

    im in here do smash me :d

  20. 21

    I’ve read many of your articles and I like the way they’re written and the info provided and that is the reason I am subscribing.

    Thanks! :)

  21. 22

    Oh, I always thought it’s just another way of receiving your blog articles. Good to know that the newsletter contains exclusive information! :)


  22. 23

    I find newsletters useful and generally interesting. They are a way to go beyond my inbred work inviornment.

  23. 24

    I’m happy to be here today, I had no idea that you guys sent out a newsletter! Now I’m a grateful subscriber.

  24. 25

    i am a regular visitor of Smashing MAG and i love it like anything. It acts as a supplement to my creative thrust. Although i have zillions of ideas bouncing inside my gray head, most of them are quenched and remaining pondering for something more. So i always want to be in touch with SM…. u ROCK!!!!….

  25. 26

    Great Work Guys but, Please keep the Subscribe option in an easily locatable place. I spent 10 Mins to find it.

  26. 27

    Exceptional straight forward subscription process. Also, sharing the .vcf is a great idea to forestall false-positive SPAM. Looking forward to you next issue, thanks!

  27. 28

    Its odd that I missed the last two edition, issue 35 and 36. Can you guys check my subscription status. My email is the one i used for this very comment.

    Thank you.

    • 29

      Vitaly Friedman

      July 4, 2011 11:06 pm

      Hi Joe,

      The status is perfectly fine. Perhaps your mail server marks our emails as “spam”? Could you please double-check it? Please make sure that our newsletters are whitelisted!


  28. 30

    Javier Gomez VE

    July 16, 2011 7:59 am


  29. 31

    Every single newsletter beats its reader count from the one before … amazing.

  30. 32

    Love your creativity, will follow through. Thumbs up!

  31. 33

    I love how well they express their ideas! geek ever!

  32. 34

    Strange for such an excellent site and webdeveloper-oriented bunch of geeks to have such an appalling email-signup process… ever heard of Campaign Monitor, guys?
    Just kiddin. I’m quite busy tuning MailChimp myself for some clients and it is a bit daunting to say the least. Didn’t expect to see default stuff coming from Smashing Mag though.

    cheers Peter Emil

  33. 35

    You guys just passed the 100k subscribers mark.

  34. 36


  35. 37

    you are a super team!!! great work!!!!

  36. 38

    Landon Cahow

    March 9, 2012 4:36 pm

    I’ve been subscribed to the Smashing Email Newsletter for a while now, it’s always full of great info and I look forward to getting it every time.

    Keep up the good work guys!

  37. 39

    Stefan Hansel

    April 23, 2012 9:40 pm

    Thanks for the great magazine! I’ve been reading your articles for a long time. And the Smashing Network has been a great resource too. Where has it gone?

  38. 40

    Dear Smashing Magazine , i can’t find anymore the smashing Network section !!! is it canceled ?

    Thanks in advance

    • 41

      You “have” to subscribe to get back into the network, still cant find a way round it.

      I am on my work PC, having already subscribed at home, seems like I cannot get into the network without re-subscribing….

      The smashing newsletter is great but I do not agree with the, seemingly, forceful way of gaining subscribers.

  39. 42

    Werner Swiegers

    April 26, 2012 11:33 am

    Yeah, what happened to the smashing network?

  40. 43

    Subscribed :)
    Got your Tweet

  41. 44

    Is there a way to update the emails for the subscription, I want to reroute the old email address and replace it with a new email address. The “cancel your subscription” link is not working today.

    Also is there a way get the older newsletters resent mailed, to your re-confirmed new address, just found I missed a few when they changed the work spam filters, I want the complete set in my mailbox. The newsletters are that great.

    • 45

      Vitaly Friedman (editor-in-chief of Smashing Magazine)

      December 18, 2012 3:29 pm

      The “cancel your subscription” link is actually working. Could you please try again, Eric? Thanks for your kind words!

  42. 46

    wow, looking at this list I realise just how many newsletters there have been! I signed up for the very first newsletter and have had them coming to my inbox for more than 2 years. How time flies!

    Always looking forward to the next newsletter, good stuff!

    ~ Steven Noble
    Graphics Cove

  43. 47

    done :D

  44. 48

    Heather Slabosz

    May 4, 2013 8:38 pm

    I was interested in receiving your newsletter (that I just signed up for) on this kindle fire (which I have not purchased yet) Is that possible? I will definitely not be running a data plan with it. I would just like to download to the kindle and read from there.

    I understand I can purchase the ebooks and use them on my kindle – but I am wondering if I can do the same with your newsletter.

    Much thanks, Heather

  45. 49

    How can i get regular update on activities, is there any subscribtion ?

  46. 50

    I’m trying to subscribe. I’m being sent to a wordpress login page for your domain which states that “this plugin is already installed” when i enter my email and hit the subscribe button

    • 51

      Vitaly Friedman (editor-in-chief of Smashing Magazine)

      July 26, 2013 1:05 am

      It must have been a temporary issue! Please try again, Meag!

  47. 52

    3 words, count me in.

  48. 53

    Let’s say we have an interesting article to share, could we post it for review somewhere?
    Would be nice to have to people read or opinion and tips / tricks.

  49. 54

    Jose Almonte

    March 21, 2014 6:46 pm

    I was jsut looking for some pdf books and free templates to practice what i´m learning about Semantic Web, SEO, HTML5, CSS, Prototyping, Responsive Web Design and i´m sure i´ve came to the right place.

    Thanks for sharing this wonderful content. Best regards to all.

  50. 55

    I’m surprised I can’t find anything on this! Any chance to subscribe to your newsletter by RSS?

  51. 60

    Hello, I downloaded your WP theme, but I have a problem with it. WordPress said that there is no style.css stylesheet
    Where can I get it?

    Kind regards Judith

  52. 61

    This is great! Thanks!

  53. 62

    Fakultet Gashi

    March 18, 2016 8:02 pm


    I can’t find any text about using your data on other websites. I’m gonna create a website and I want to use some of your articles. Can I do that or not ?


  54. 63

    Renata Jourdan

    June 26, 2016 8:16 pm

    Please!!! When can we have workshops in Lisbon!! :)


Leave a Comment

You may use simple HTML to add links or lists to your comment. Also, use <pre><code class="language-*">...</code></pre> to mark up code snippets. We support -js, -markup and -css for comments.

↑ Back to top