Tag: css

# Color Formats in CSS

Nice introduction into CSS color formats by Joshua Comeau. I learned about the upcoming lch():

LCH is a color format that aims to be perceptually uniform to humans. Two colors with an equivalent “lightness” value should feel equally light!

Looks great!

Also, TIL about that rgb(r g b / a) thing I’ve seen a few times:

For most of CSS’ existence, we specified RGB colors using a slightly different syntax.

This changed in CSS Colors level 4, which introduces a standardized notation used across newer color formats. rgba() isn’t explicitly deprecated, but it’s recommended to use the newer format (fortunately, browser support is excellent).

Colors — default web palette replacement

Remember the good old web palette? Colors that have names in CSS: navy, green, maroon, red, etc? Orange that was added in CSS Level 2? Well, they don’t look good anymore. Most designers don’t use these default colors, apart from maybe black and white, instead, they usually create unique color schemes for websites.

If you don’t want to spend a lot of time looking for a good color scheme for your new website, check out Colors, a “a nicer color palette for the web”.

Continue reading “Colors — default web palette replacement”

Hint.css — pure CSS tooltips

While browsers have built-in support for tooltips, which can be added by setting the title attribute, unfortunately, such tooltips don’t look good and have a long delay before they appear. There are many JavaScript libraries for better looking and better behaving tooltips, for example, Bootstrap includes one. It turns out, though, that you can implement them with CSS alone, and that’s what Hint.css does.

Continue reading “Hint.css — pure CSS tooltips”

3 Minimalistic Bootstrap Alternatives

Bootstrap is the most popular HTML/CSS framework, and there are many good reasons why lots of developers use it to make websites. There are also many developers who complain about “bootstrapy” look of websites built on it. This is understandable, but as someone said, your users don’t care that your site is “bootstrapy”.

I’ve built a few Bootstrap-based websites, and for me, “bootstapy” look is not that important. What’s really important, though, is that when using Bootstrap, I think in its terms and usually select components from the available set, even though they may be a completely wrong solution to the problem. When you don’t have this popup or that dropdown button available, you won’t slap them everywhere, and think of a better UI. Thus, to clear the clouded mind, it’s a good idea to try other frameworks from time to time. This time I’ll cover minimalistic CSS frameworks, which are good Bootstrap alternatives when you don’t want to use all the features provided by it.

Continue reading “3 Minimalistic Bootstrap Alternatives”

Download web fonts from Google with webfont-dl

If you’re using Google Fonts to improve your website appearance, your visitors are always forced to download the initial CSS file describing fonts from Google’s servers every time they load a page, even though requests to the actual fonts may be cached. This can make your site slower. There are benefits to serving fonts from Google’s servers (for example, Google sends differently hinted fonts for Windows and OS X to improve their readability), however if you want to avoid depending on Google, or to improve load times, you may want to host the fonts yourself.

Continue reading “Download web fonts from Google with webfont-dl”