Category: Design

All about design

Creating a hero header with a fixed image

crysfel Design

In this tutorial I'm going to show you how to create a Hero header with a fixed image as the background and an overlay gradient on top. The image will have cover the whole screen with some text and a call to action in the middle. As always, we are going to use tailwind for this! You can take a look at the final result here: See the Pen Fixed Hero Header by Crysfel (@crysfel) on CodePen. Defining the markup The first thing we are going to do is to define the markup for the header, as a rule of Continue reading