CSS by T. Afif

@css-only.dev

6848 Followers 94 Following

CSS stuff by Temani Afif (https://support.temani-afif.com) 💡 https://css-tip.com 🧩 https://css-shape.com 💫 https://css-loaders.com 📝 https://css-articles.com ⚙️ https://css-generators.com 🧱 https://css-pattern.com 🎨 https://css-only.art

A responsive ascii art of a dragon
A responsive CSS grid where the elements move smoothly to their new position when the grid is resized
Overview of the CSS code from the linked post
Overview of the CSS code from the linked post
An ugly range slider with an ugly tooltip following the thumb and showing the current value
An interactive demo showing a horizontal list of items having a separator between adjacent items.
Range sliders with wavy lines
One of my CSS-only demo at the CSS Day
Two boxes connected with a curved line
Diagram with various nodes connected with lines
A diagram with various elements linked with straight or curved lines (I am looking to name)
Two boxes linked with a curved line
Three circles linked with curved lines that adjust based on the distance between the circles
Two circles connected with a straight line that bends when they get closer and stretches when they get farther.
Google AI telling me there are 2 p's in the word Firefox
3 circles connected with curved lines
Two circles linked with a curved line that become straight when both circles are close to each other.
Three shape variations (filled, border-only, and cutout)
Image carousel with button controls
Overview of the CSS code from the link in the quoted post
6 colorful box rotating at various speed
Screenshot of my bug reports fixed
A tooltip following an anchor on drag
The following CSS code: .box { place-self: unsafe end unsafe anchor-center; }
Showing 2 examples of shape created using CSS and the cutout version of each one.
A sticky header that gets distorted on scroll to have a random wavy shape at the bottom
A navigation menu with items having a hand-drawn style underline
A CSS-only drawing of Chris Coyier (yes, it's not a joke)
Screen record of my SVG-to-CSS online converter
Screen record of a CSS wavy divider generator
A screen record of my blob shape generator
Various CSS-only shapes applied to random images
Overview of the border-shape property
An overview of my CSS-only Dino game
A sliding liquid effect made using CSS
The chrome dino game made using pure CSS
12 CSS-only loaders with random squishy shapes
Overview of the CSS code from the provided link
Wobbling animation with an image element
A pattern with pill and circle shapes
CSS-only squishy buttons