I had to build a card component that looked a little different than the usual cards you find on most websites. Now we got the chance to refactor the code, and I took another look at the component to see if I better solution with modern CSS.
Last week, I had the incredible opportunity to attend my first CSS Day in Amsterdam. It was an exceptional experience that left me brimming with newfound knowledge. While I felt confident about certain topics, such as the has-selector and container...
Recently I was faced with the following problem: I had to build a layout that consists of several rows. In each row are two images with a fixed aspect ratio. The two images should have the same height and fill the entire row. The images' aspect...
Learn how to build an algorithmic layout that switches from two centered elements to a spaced-out flex layout.
Do you know the feeling when a subject never lets you go? In the last years, I have worked with different graphics programs and have written many lines of CSS. Even though it is now easy to copy CSS code for gradients directly from e.g. Figma, I...
Layouts with diagonal sections are quite popular for several years now. You will probably not find it in the articles titled "Design trends for 2020". But I think it is here to stay.
One of the many challenges when it comes to writing CSS is choosing the right unit. Over the years there has been a lot of controversies whether to use px, em or rem to size text. So I thought, why not add some custom properties to this mixture and...
How to create very cool effects with a rarely used feature.TL/DR: When you use eight values specifying border-radius in CSS, you can create organic looking shapes. WOW.
We at 9elements organize an annual JavaScript conference called RuhrJS. The key visual shows a shaft tower and the conference name executed with a neon light effect. The main page features the full visual with flickering lights. This effect is...
How to create a logo that responds to its own aspect ratio There are quite a few articles on the web that deal with responsive logos. The most popular example might be the Responsive Logos website that shows some very well known logos in different...
