CategoryCSS

January 10, 2022 — In this article, we’ll be taking a closer look at two gradients: conic-gradient and radial-gradient. You’ll see how each one of them works in detail, what the differences and similarities are between them, how and where to use them, and some use cases for each. Read more…

December 23, 2021 — Range inputs have notoriously been a pain to style. Each browser renders the input differently requiring you to use vendor prefixes in order to create a cohesive look and feel. In this article, we’ll take a look at the quirkiness of the HTML range input and demonstrate how to style the input to look consistent across all major browsers. Read more…

November 29, 2021 — One of Jhey’s main mantras is to make learning fun. In this article, he shows you ways to level up your skills by bringing your ideas to life, and not forgetting that you can be playful with code. With that mindset, every idea is bound to become an opportunity to try something new. Read more…

November 23, 2021 — With a little CSS, we can adapt our web designs to be more accommodating for people with dyslexia. In this article, we’ll explore those techniques by adding a dyslexia-friendly mode to an existing design. Read more…

November 17, 2021 — In this article, we’ll take a look at the best ways to handle colors in CSS today, some tips for using them in a design system, and what we can expect from our colors in the not-too-distant future. Read more…

October 25, 2021 — In this article, we will go through how object-fit and background-size work, when we can use them, and why, along with some practical use cases and recommendations. Let’s dive in. Read more…

October 21, 2021 — The prefers-reduced-motion media query has excellent support in all modern browsers going back a couple of years. In this article, Michelle Barker explains why there’s no reason not to use it today to make your sites more accessible. Read more…

October 14, 2021 — Writing CSS has probably never been more fun and exciting than it is today. In this post we’ll take a look at common problems and use cases we all have to face in our work and how to solve them with modern CSS. If you’re interested, we’ve also just recently covered CSS auditing tools, CSS generators, front-end boilerplates and VS code extensions — you might find them useful, too. Read more…

October 9, 2021 — Most animation libraries like GSAP and Framer Motion are built purely with JavaScript or TypeScript, unlike AnimXYZ, which is labelled “the first composable CSS animation toolkit”, built mainly with SCSS While a simple library, it can be used to achieve a lot of awesome animation on the web in a short amount of time and little code. Read more…

October 6, 2021 — Debugging in CSS means figuring out what might be the problem when you have unexpected layout results. We’ll look at a few categories bugs often fit into, see how we can evaluate the situation, and explore techniques that help prevent these bugs. Read more…