CSS Articles by Temani Afif

Extracting Grid Information Using CSS Read the full article online

Hover Proximity Using Modern CSS Read the full article online

Something Nobody Told You About The Image Element (It Can Overflow!)

In-N-Out Animation using sibling-index() Read the full article online

Get Ready For the Powerful CSS border-shape Property!

Let’s Play With Gap Decorations!

How to Control Infinite CSS Animations (Part 2 of 2) Read the full article online

How to Control Infinite CSS Animations (Part 1 of 2) Read the full article online

Two Circles, One Arrow, and Anchor Positioning Read the full article online

Making a Responsive Pyramidal Grid With Modern CSS Read the full article online

How to Create a CSS-only Elastic Text Effect Read the full article online

Making Complex CSS Shapes Using shape() Read the full article online

Responsive Hexagon Grid Using Modern CSS Read the full article online

Responsive List of Avatars Using Modern CSS (Part 2) Read the full article online

Responsive List of Avatars Using Modern CSS (Part 1) Read the full article online

Perfectly Pointed Tooltips: To The Corners Read the full article online

Perfectly Pointed Tooltips: All Four Sides Read the full article online

Perfectly Pointed Tooltips: A Foundation Read the full article online

Sequential linear() Animation With N Elements Read the full article online

Infinite Marquee Animation using Modern CSS Read the full article online

Better CSS Shapes Using shape() — Part 4: Close and Move Read the full article online

Drawing CSS Shapes using corner-shape Read the full article online

Better CSS Shapes Using shape() — Part 3: Curves Read the full article online

Better CSS Shapes Using shape() — Part 2: More on Arcs Read the full article online

Better CSS Shapes Using shape() — Part 1: Lines and Arcs Read the full article online

Creating Blob Shapes using clip-path: shape() Read the full article online

Creating Flower Shapes using clip-path: shape() Read the full article online

Custom progress element using the attr() function Read the full article online

A CSS-Only Star Rating Component and More!

A CSS-Only Star Rating Component and More!

How to Create Wavy Boxes Using CSS Read the full article online

Full-Bleed Layout with Modern CSS Read the full article online

Fancy Menu Navigation Using Anchor Positioning Read the full article online

How to Create a Zig-Zag Box Using CSS Read the full article online

How to Create Zig-Zag CSS Loaders Using One Element Read the full article online

Custom Progress Element Using Anchor Positioning & Scroll-Driven Animations Read the full article online

How to Create Filling CSS Loaders Using One Element Read the full article online

How to Create Curved-Edge and Rounded-Edge Shapes Using CSS Read the full article online

CSS Tricks That Use Only One Gradient Read the full article online

How to create Shapes with Inner Curves using CSS Mask Read the full article online

Custom Range Slider Using Anchor Positioning & Scroll-Driven Animations Read the full article online

How to Get the Width/Height of Any Element in Only CSS Read the full article online

How Keyboard Navigation Works in a CSS Game Read the full article online

How To Create Cut-Out Shapes using The clip-path property Read the full article online

The Modern Guide For Making CSS Shapes Read the full article online

css-shape.com: The Ultimate Collection of CSS-only Shapes Read the full article online

Sliding 3D Image Frames In CSS Read the full article online

CSS Tricks To Master The clip-path Property Read the full article online

Creating Wavy Circles with Fancy Animations in CSS Read the full article online

Modern CSS Tooltips And Speech Bubbles (Part 2) Read the full article online