Best of the web for Design and Web Development December 2021

• December 30th, 2021
• News

This is the penultimate edition of our monthly web round up where we finish the month by rounding up all the best design tutorials and web articles published on the online community. This months edition is jam packed with some great design tutorials from 3d depth illustrator text effect to a Christmas festive pattern. Theres some great article worth reading through also, UI trends to keep an eye on in 2022 to whats new tailwind css.

We hope enjoy this months roundup, as it jam packed with some great post. Please feel free email across any blog posts you would like feature in next months edition.

Design Tutorials

How to Easily Create Double Exposure Effect in Photoshop

In this tutorial, I will show you how easy it is to create double exposure effect in Photoshop 2020, with the help of the brand new object selection tool.

How to Create a Cat Logo Design in Illustrator

In the following tutorial, you’ll learn how to make a creative cat logo design in Adobe Illustrator.

How to Make a 3D Depth Text Effect in Illustrator

There are many different methods to achieve certain effects in Illustrator. And often what it seems to be an intricate effect can be quickly reproduced if you know which tools to use. If you need a quick depth effect on your text, then this tutorial is just right for you. Today, I will show you how easily you can give a 3D Depth Effect to your text using nothing but the default Illustrator tools.

How To Create a Seamless Pattern in Adobe Illustrator

Follow along with this tutorial to learn how to create a seamlessly repeating pattern in Adobe Illustrator. We’ll compose a series of illustrations, then I’ll show you a useful tip for adding a background colour directly to your pattern swatch.

How to Easily Make a Custom Chalk Effect in Photoshop

There are many different methods to make a design look like it was made with chalk, from using plugins to filters. But most of these methods may not have the exact look you want, due the textures or patterns they use. But there is a way to make a chalk effect that looks exactly as you want using a regular pencil. Today I will show you an easy technique to make a realistic custom chalk look in Photoshop you can use for your logos, badges, lettering, and almost any other design.

How to Create a Retro Logo Design with Texturing Effects

How to Make a Galaxy Brush in Photoshop

Wondering how to create a galaxy brush Photoshop effect? Today I’m going to show you how to create galactic brushes, star brushes, and a space Photoshop background.

Web and Design articles

How to Find and Fix a WordPress Pharma Hack

Did you know that one quarter of all spam emails are accredited to pharmaceutical ads? Pharma hacks go beyond the inbox and spam websites by redirecting traffic and adding fake keywords and subdomains to the search results.

How to share Figma components across files

Using Components in the same file is okay if you only have a few, but existing libraries often have many pages of Components you might want to use. Sometimes even multiple files. There is a way to re-use these without copying and pasting these into your working file again and again. This will help you create your own Design System, or work from someone else’s copy.

SVG vs PNG: What Are the Differences and When to Use Them

There are dozens of image file types, each varying based on compression type, formatting, and browser support. But two of the most commonly used are SVG and PNG formats.

2022 UI design trends guide

2021 was an exciting year for designers — the introduction of Metaverse caused quite a disruption in the industry. Many assumptions from the 2021 article has become more than just a trend — and many of them evolved into something completely new.

Tailwind CSS v3.0

Tailwind CSS v3.0 is here — bringing incredible performance gains, huge workflow improvements, and a seriously ridiculous number of new features.

Defensive CSS

Defensive CSS is a collection of snippets that can help you in writing CSS that is protected. In other words, you will have fewer issues in the future. If you follow my blog, you might read an article I wrote a while back which is called “The just in case mindset”. This is built upon it, and will be an ongoing list of snippets. If you have any suggestions, please feel free to let me know about it.

The CSS :has() selector is way more than a “Parent Selector”

This selector is dubbed “the parent selector”, as the default cases indeed allow you to select a parent element that has certain children.