3 tricks for a unique website

Emanuel Wittmann

6.12.2023

•

7 min reading time

Are you already developing really cool sites? Do you build in complex animations over hours to fill the page with life? But somehow do you think it could be even better? Here is the solution ⤵

Perhaps one of these tricks will help you get the last percentages out so that the created masterpiece itself withstands your critical eye 😉

Custom scrollbar

Yes, that's right, you can adjust the square gray thing on the right side of your browser.

The following are customizable: color, background color and width

For example, it looks like this in the code:

scrollbar-color: #009E94 #e7e7e7;
scrollbar-width: thin;

For optimal browser support, check out this link:

to Stack Overflow

Marking texts

When you highlight a text, a light blue background usually appears and the text turns white.

You can also adapt this to your branding. It's cool, isn't it?

The following are customizable: color and background color

It looks like this in the code:

::selection {
color: #FFF;
background: #00949E;
}

For optimal browser support, simply add the following additional code:

:: -moz-selection {
color: #FFF;
background: #00949E;
}

Theme Color

The least used in my experience. And yet very powerful 🙌🏽

Therefore spoiler: This function is currently not yet available across browsers. But on Safari and Chrome for Android, it certainly already enhances the website.

Are you wondering where the theme color is actually displayed? Take a close look at the picture ⤵

To achieve this, all you have to do is add the following code snippet to your website <head>tag: