bttn.css – A set of ready-coded CSS buttons

bttn.css is a small CSS library built by Ganapati Bhat to be included into your main stylesheet and easily add beautiful buttons to your own web project. Once you do that, you just need to add some classes to HTML buttons and you are done. Super easy! Buttons come in 6 colours and 9 different styles, but they’re customisable at your own pleasure with… Continue reading bttn.css – A set of ready-coded CSS buttons

The Big Interview: Kevin Ball and Rafi Benkual talk all things ZURB

This month we got the opportunity to interview Kevin Ball and Rafi Benkual from ZURB. We got to talk about the future of the web, the state of web design today, and of course, about Foundation. WebdesignerDepot: Hello Ladies and Gentlemen, I am Ezequiel Bruni for Web Designer Depot, and today we are talking to… Continue reading The Big Interview: Kevin Ball and Rafi Benkual talk all things ZURB

Top 10 resources for designing email newsletters

The world of email marketing is constantly changing. There are dozens of tools out there tailor made to help marketers write emails, designers craft emails, and developers code emails. But with so many tools available, it can be frustrating to find the best ones. That’s why, in this post, I’ve curated the top ten best… Continue reading Top 10 resources for designing email newsletters

Applying artistic facial effects to images on the fly

Ever wished you could add snapchat like effects on your images? Good news is, you actually don’t need extensive training or specific face detection skills to get started. All you need is Cloudinary. Cloudinary is a cloud-based image management solution that gives you the power to upload, store, manipulate, optimize and deliver images. It also… Continue reading Applying artistic facial effects to images on the fly

Angular 2 Transclusion using ng-content

Free Course Getting Started with Angular 2 Angular 2 is the shiny new framework that comes with a lot of new concepts. Learn all the great new features. Get Started Wait a minute… What is transclusion? Understanding Transclusion Don’t get confused by the term Transclusion. It’s best explained using an example. Let’s say we have… Continue reading Angular 2 Transclusion using ng-content

Automatic responsive images with client hints

Over time, developers have wrestled with forcing images into responsive layouts. Media queries and fluid grids are constantly employed to achieve visually flexible images. Achieving such flexible images as pointed out by Ethan Marcotte in the seminal first edition of his book  is as easy as: img { max-width: 100%; } The image resources being… Continue reading Automatic responsive images with client hints

Poll: should coders learn to design?

Okay developers, it’s your turn. People have ranted on and on for years about whether or not designers should learn to code. Heck, I’ve ranted about it. I still contend that… no. No no… This is about you devs, now. Should people who primarily code the back end of web products learn to design the… Continue reading Poll: should coders learn to design?

Social Media Sharing Buttons without JavaScript

Posted · Category: MIT License, Social Love or loathe them, sharing buttons will not go away for a while. The default social media sharing scripts provided by the networks themselves are big, often download multiple files and track users across the web. Social Media Sharing Buttons generator outputs social media sharing buttons that do not… Continue reading Social Media Sharing Buttons without JavaScript

Algolia Places – Fast and Beautiful Address AutoCompletion

Posted · Category: Maps, MIT License Algolia Places is a fast, beautiful and easy-to-use address autocompletion. It turns any <input> into an address autocomplete. Algolia Places provides a fast, distributed and easy way to use an address search autocomplete JavaScript library on your website. It has been designed to improve the user experience of your… Continue reading Algolia Places – Fast and Beautiful Address AutoCompletion

How to Build a News Website Layout with Flexbox

What You’ll Be Creating It’s not necessary to understand every aspect of Flexbox before you can jump in and get started. In this tutorial, we’re going to introduce a few features of Flexbox whilst designing a “news layout” like the one you can find on The Guardian. The reason we’re using Flexbox is that it… Continue reading How to Build a News Website Layout with Flexbox

15 Free Admin Dashboard Templates (PSD & Sketch)

In recent years, much has changed in the way web users interact with dashboard data and complete simple backend tasks. Layouts are more spacious and mobile-friendly, colors are simpler, typography is highly-readable, interactive charts make data much easier to digest, and advancements in technology have made completing tasks much quicker. The admin panels of 2016… Continue reading 15 Free Admin Dashboard Templates (PSD & Sketch)

How to Create an AJAX Driven Theme for ProcessWire

In this tutorial we will look at setting up a simple theme in ProcessWire, we’ll investigate delayed output (now the default theme strategy within ProcessWire), and setup our site to request new content using AJAX. To accompany this tutorial I have created a new theme for ProcessWire, making use of both AJAX and delayed output,… Continue reading How to Create an AJAX Driven Theme for ProcessWire

Ruby Templating With Slim: Part 2

In the second and last part of this mini series, we’ll finish this introduction with sections about outputting Ruby code, interpolation, plain text and how to customize Slim to your needs. After that article you should be ready for some Slim action.  Outputting Code You have already seen a bit about how to use Ruby in… Continue reading Ruby Templating With Slim: Part 2

Learn the Basics of HTML in Our New Course

Do you need to learn HTML from the ground up? If so, our new course, Start Here: Learn HTML Basics, is perfect for you. What You’ll Learn The most critical first step to becoming a web designer is learning how to code HTML. By the end of this short course you’ll know what HTML is, how it… Continue reading Learn the Basics of HTML in Our New Course

9 Creative CSS3 Animation Tools You Should Bookmark

Are you looking for some free to use CSS3 animation tools? Well, if your answer is yes, then you are lucky enough to land on the right page. In this round up, we are presenting 9 amazing and best CSS3 animation tools that every designer must know. You can bookmark these animation tools for your… Continue reading 9 Creative CSS3 Animation Tools You Should Bookmark

Selecting Parent Elements with CSS and jQuery

There have been occasions where I’ve wished I was able to select a parent element with CSS–and I’m not alone on this matter. However, there isn’t such thing as a Parent Selector in CSS, so it simply isn’t possible for the time being. In this tutorial we will walk through a few cases where having a CSS… Continue reading Selecting Parent Elements with CSS and jQuery

New Providence: Free landing page HTML + PSD

New Providence is a free landing page template designed by Denis Shepovalov and Rui Bogas for MarketMe. The overall style is modern thanks to its clean colour combination, balanced typography and high-quality iPhone mockups. The freebie includes the original PSD design assets and the HTML template. Download template 

New Course: Advanced Animation With GSAP Plugins

What You’ll Be Creating The GreenSock Animation Platform is a powerful JavaScript library for animating HTML elements in the browser. In our new course, Advanced Animation With GSAP Plugins, you will learn how to take your GSAP animations to the next level using the plugins that come with the platform. What You’ll Learn Our recent GreenSock Animation… Continue reading New Course: Advanced Animation With GSAP Plugins

20 Useful WordPress Gallery Plugins

Several WordPress versions ago, putting together an image gallery wasn’t the easiest thing to do, let alone a gallery of videos or products for sale. Today, however, there are many WordPress gallery plugins that are creative, powerful, and highly configurable. Sure, the Jetpack gallery is great in comparison to the early days of WordPress, but… Continue reading 20 Useful WordPress Gallery Plugins

9 Best jQuery Autocomplete Plugins

For today’s round up, we have collected 9 best jQuery auto complete plugins for you. Auto complete feature lets your users to quickly find and select from a pre-populated list of values that they have previously saved in the form. This will result in saving lots of time and energy. This is exceptionally helpful for… Continue reading 9 Best jQuery Autocomplete Plugins

HTML5 Fundamentals

HTML5 is huge at the moment. Even my grandparents have heard of it! In step-by-step fashion, we’re going to dig into this new technology, including the various new HTML tags, feature detection, and working with a couple of the new JavaScript APIs. Are you ready? https://youtu.be/OdkH1Ue0iQ4 https://youtu.be/VuW2Qztht34 https://youtu.be/FqLeyfzJS5I https://youtu.be/Nonz4M3lJ7M https://youtu.be/JdzfrQMyip4 https://youtu.be/9ccmiVNLXFE https://youtu.be/WTH06GqotTA