A short tutorial on how to create images in CSS

Single-div timelapse
Single-div timelapse
Single-div timelapse by the author.

Simplest Illustration


HTML5 added a lot of new tags. Let’s discover a few that you might not know

Colorful form with empty fields
Colorful form with empty fields
Photo by the author.

1. Progress Bar


These days, it’s hard to get your first tech job without impressing your employer with your portfolio

Image for post
Image for post

Create Interesting Projects for Your Portfolio


Many people build weather apps to show off their new skills. Don’t let yours be boring

image of a storm cloud emitting a flashing bolt of lightning
image of a storm cloud emitting a flashing bolt of lightning
Image credit: Author


And an intro to glassmorphism

a vivid, multi-coloured pastel screen on which part of the word “glassmorphism” is transparent
a vivid, multi-coloured pastel screen on which part of the word “glassmorphism” is transparent
Image credit: Author

New Trend


CSS gives us the opportunity to create multiple Shapes.

Image for post
Image for post


A lot of images can be replaced with CSS

Image for post
Image for post

How images slow down my page?

  • Heavy images: a website with large images will load much slower. Each image is an additional request to the server and extra seconds to wait.
  • Wrong dimensions: Each image should have a few different sizes. …


Add some life to your website

Example of gradient color button
Example of gradient color button
Photo by the author.

Outline Button — Easy, Straight, and Boring

<a href="/" title="Hello button" class="btn">Hello</a>


Starting this blog took me almost half a year, but it finally happened.

Image for post
Image for post
Industry part of Gdańsk city

Who am I

About

Albert Walicki

Frontend developer, entrepreneur, biker. 👉 My Frontend book: www.frontendunicorn.com 👉 We build apps at www.hype4.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store