CategoryCSS

March 16, 2022 — This fresh new design trend has been picking up steam with the rising popularity of colorful inflated 3D graphics in web illustrations and with the latest Virtual Reality projects like “Horizon Worlds”. Let’s see if there is room for Claymorphism on the UI, and how we can create this effect with CSS. Read more…

March 3, 2022 — Dual-screen devices are just the next evolution in responsive design. If you have a PWA or website, the APIs available make integrating into your existing code base seamless. This article explains why it’s an exciting time for layout on the web, and how dual screens provide an opportunity to get even more creative. Read more…

March 1, 2022 — 2022 is shaping up to be a pretty great year for CSS, with a plethora of new features on the horizon. Some are already starting to land in browsers, others are likely to gain widespread browser support in 2022, while for one or two the process may be a little longer. In this article we’ll take a look at a few of them. Read more…

February 22, 2022 — How do text typing and editing work on the web? Although this process might seem straightforward, there is a lot of technical nuance behind its apparent simplicity. This article looks at how typing on the web works. Read more…

January 24, 2022 — Cascade layers introduce the new at-rule of @layer. The intent is to help CSS authors be more intentional about ordering the “layers” of CSS rules as a new method of cascade management. Read more…

January 17, 2022 — We’ll explore fluid typography principles, use-cases, implementation with CSS clamp() and an interactive fluid typography calculator. Read more…

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. It’s fun to make things that we may not create on a day-to-day basis. Demos like this can pose different challenges and can level up your problem-solving game! Read more…

November 23, 2021 — The separation of content and presentation that CSS gives us always comes in handy when we need to adapt designs to better serve different communities. With a little CSS, we can adapt our web designs to be more accommodating for people with dyslexia. In this article, John C Barstow will explore those techniques by adding a dyslexia-friendly mode to an existing design. Read more…