Tag: Sass
In this series, we’ve been making image sliders with nothing but HTML and CSS. The idea is that we can use the same markup but different CSS to get wildly different results, no matter how many images we toss …
CSS Infinite 3D Sliders originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
In the last article, we made a pretty cool little slider (or “carousel” if that’s what you prefer) that rotates in a circular direction. This time we are going to make one that flips through a stack of Polaroid …
CSS Infinite Slider Flipping Through Polaroid Images originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
Let’s acknowledge that developing for WordPress is weird right now. Whether you’re new to WordPress or have worked with it for eons, the introduction of “Full-Site Editing” (FSE) features, including the Block Editor (WordPress 5.0) and the Site Editor (WordPress …
Getting Started With WordPress Block Development originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
The wave is probably one of the most difficult shapes to make in CSS. We always try to approximate it with properties like border-radius and lots of magic numbers until we get something that feels kinda close. And that’s before …
How to Create Wavy Shapes & Patterns in CSS originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
SVG is the best format for icons on a website, there is no doubt about that. It allows you to have sharp icons no matter the screen pixel density, you can change the styles of the SVG on hover …
How I Made an Icon System Out of CSS Custom Properties originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
Imagine you have an element with a multi-value CSS property, such as transform: optional custom property values:
.el { transform: translate(100px) scale(1.5) skew(5deg);
}
Now imagine you don’t always want all the transform values to be applied, so some …
Multi-Value CSS Properties With Optional Custom Property Values originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
(This is a sponsored post.)
Design systems are an entire job these days. Agencies are hired to create them. In-house teams are formed to handle them, shipping them so that other teams can use them and helping ensure they …
Build, Ship, & Maintain Design Systems with Backlight originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
One of the things that makes this new, tooling-heavy era of front-end development so seemingly hard to understand at first is that, while we often call things by a singular name, they tend to be actually comprised of several different …
What the Heck Does “npm” Mean? originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
Now that we know what npm stands for and have a super general idea of what it does and how it fits into web development, we ought to spend a little bit of time looking at the command line, because …
What the Heck is the Command Line? originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
(This is a sponsored post.)
Here’s what you need to know about Node.js (or simply Node) and how it relates to npm right off the bat:
Node is JavaScript, but as a server-side language.
This is possible because of
…
What the Heck is Node? originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.
...
