Frontend News aims to keep you updated with what's happening in the world of web dev! With the latest news and resources from the design & development community.

CSS Media Queries

A Complete Guide to CSS Media Queries

A comprehensive guide to CSS Media queries! We use Media queries to modify the appearance (and even behavior) or a website or app based on a matched set of conditions about the user’s device, browser or system settings.

Read it ➡️

Face Motion Image

How To Use Face Motion To Interact With Typography

In this article, we will see how to combine Machine Learning, variable fonts, and CSS grids to create layouts that respond to the proximity, the inclination, and the number of the users’ faces.

Read it ➡️

Scroll to top hand

How to Make an Unobtrusive Scroll-to-Top Button

Let’s look at a few ways we can create an unobtrusive scroll-to-top button, starting simple, then improving things as we go.

Read it ➡️

OSA 2020 Winners

The Winners of the Outstanding Shop Awards 2020

Judging has wrapped and we’re excited to announce the winners of the first annual Outstanding Shop Awards, presented by Pixel Union and Out of the Sandbox.

Read it ➡️


Using JavaScript to Adjust Saturation and Brightness of RGB Colors

A deep dive into working with colors using JavaScript!

Read it ➡️

Useful Tools In Vue.js Web Development Article Card

Useful Tools In Vue.js Web Development

A look at several tools that developers may not be aware of, that make development in Vue a whole lot easier.

Read it ➡️

Tree Logo

The Widening Responsibility for Front-End Developers

Some awesome insight by Chris Coyier! Drawing from a number of resources - he takes a look at what it means to be a frontend developer today. As full-stack work continues to blend itself into traditional "front-end" roles.

Read it ➡️

CSS Fun Logo

Comparing Styling Methods in 2020

A nice overview of the latest & greatest CSS styling methods!

Read it ➡️

Motion Blur Effect

How to Create a Realistic Motion Blur with CSS Transitions

In order to approximate a motion blur effect in CSS, we need to create a ton of identical elements, make them semi-transparent, and offset their animations by a tiny fraction of a second - let's see how we can do this!

Read it ➡️

Shoptalk Logo

Magic, iPad Sidecar, Getting Unstuck, Image Compression, and The Website

Chris is nostalgic for Magic the Gathering, Dave's wishing he hadn't added drawings to his blog, they're both mouthblogging about image compression and AVIF, and Jeremey Keith is back with chapter 3: The Website.

Listen up ➡️

Getting Started With Next.js Article Card

Getting Started With Next.js

Next.js is a React framework that is bound to ease your life as a React developer by abstracting away the common and redundant tasks (such as routing) into relatively simpler and powerful APIs. That way, you can focus on writing your apps instead of reinventing the wheel.

Read it ➡️

2020 State of CSS Survey Logo

Announcing the 2020 State of CSS Survey

It's taken a while (is it October already?!) but we're happy to announce that the 2020 edition of the State of CSS survey is now live, with the results hopefully following a few weeks from now.

Read it ➡️

Jhey Workspace

CSS in 3D: Learning to Think in Cubes Instead of Boxes

This article is a neat look at 3D CSS which goes over some tips and tricks that many will find useful!

Read it ➡️

WordPress and Jamstack

WordPress and Jamstack

Comparing Jamstack to WordPress is a bit weird. What is comparable is the fact that they are both roads you might travel when building a website. Much of this post will keep that in mind and compare the two that way.

Read it ➡️

Authentication In Vue.js Logo

Authentication In Vue.js

This tutorial will prove to be useful for beginner developers who want to learn about authentication in Vue. In order to be able to follow along, you’ll need to have a good knowledge of Vue and Vuex.

Read it ➡️

Previous Issue: