DEV Community

CodePen

A social development environment for front-end designers and developers.

Posts

👋 Sign in for the ability to sort posts by relevant, latest, or top.
How I recreated a Polaroid camera with CSS gradients only

How I recreated a Polaroid camera with CSS gradients only

349
Comments 19
10 min read
Website Portfolio Showcase Carousel - Vanilla JS

Website Portfolio Showcase Carousel - Vanilla JS

7
Comments
1 min read
typing animation - pure css

typing animation - pure css

7
Comments
1 min read
Rendering lists with progress bar in Vue JS.

Rendering lists with progress bar in Vue JS.

10
Comments 1
1 min read
Progress bar with Vue js

Progress bar with Vue js

11
Comments
1 min read
Fading Meme Generator

Fading Meme Generator

6
Comments
1 min read
Smooth Fullscreen Slideshow Animation

Smooth Fullscreen Slideshow Animation

10
Comments 1
1 min read
Floating Label's - Pure CSS - without Required*

Floating Label's - Pure CSS - without Required*

5
Comments
1 min read
QlockTwo in your browser!

QlockTwo in your browser!

4
Comments 2
1 min read
#CodepenChallenge Line & Direction: Border Button

#CodepenChallenge Line & Direction: Border Button

7
Comments
1 min read
CSS Grid Layout

CSS Grid Layout

89
Comments 5
8 min read
📸✨ Polaroid Camera In CSS

📸✨ Polaroid Camera In CSS

121
Comments 22
1 min read
MDC example

MDC example

3
Comments
1 min read
Fastest way to create and share code in any language

Fastest way to create and share code in any language

12
Comments
2 min read
Anatomy of a Border: a Saul Bass Demo

Anatomy of a Border: a Saul Bass Demo

16
Comments
1 min read
Awesome looking soft UI button design

Awesome looking soft UI button design

72
Comments 24
1 min read
cyberpunk retro crt style display

cyberpunk retro crt style display

47
Comments 1
1 min read
Circle animation for transitions - #GSAP

Circle animation for transitions - #GSAP

16
Comments
1 min read
hover Style Social Media Buttons

hover Style Social Media Buttons

7
Comments
1 min read
Draw and Animate Bender's Face with CSS

Draw and Animate Bender's Face with CSS

135
Comments 9
4 min read
magnet-cursor

magnet-cursor

12
Comments 12
1 min read
change with onclick

change with onclick

5
Comments
1 min read
Draw with CSS

Draw with CSS

52
Comments 2
1 min read
Footer always at bottom with flexbox

Footer always at bottom with flexbox

7
Comments
1 min read
Confused Developer: Burger or Pizza?! #EmojiToggle

Confused Developer: Burger or Pizza?! #EmojiToggle

13
Comments 2
1 min read
Codepen Developer Workspace

Codepen Developer Workspace

6
Comments
1 min read
subscribercoaster: breaking down a motion-path animation experiment

subscribercoaster: breaking down a motion-path animation experiment

5
Comments
3 min read
Animated wizard progress

Animated wizard progress

12
Comments
1 min read
Color Switcher UI with Color input type & CSS Variables

Color Switcher UI with Color input type & CSS Variables

16
Comments
4 min read
Image filter using html + css + js

Image filter using html + css + js

5
Comments
1 min read
My Shiny Gallery | An image gallery in HTML and CSS

My Shiny Gallery | An image gallery in HTML and CSS

7
Comments
1 min read
Randomising Flex Order of Items

Randomising Flex Order of Items

8
Comments
2 min read
HAPPY NEW YEAR IN 25 PROGRAMMING & SCRIPTING LANGUAGES

HAPPY NEW YEAR IN 25 PROGRAMMING & SCRIPTING LANGUAGES

4
Comments
1 min read
Showing icon on hover in button

Showing icon on hover in button

4
Comments
1 min read
4 CSS tricks that will get you dirty looks from other developers

4 CSS tricks that will get you dirty looks from other developers

260
Comments 21
2 min read
Ocean Scene

Ocean Scene

3
Comments
1 min read
#CodepenChallenge Full Page Nav

#CodepenChallenge Full Page Nav

7
Comments
1 min read
All Projects - #100 of #100Days100Projects

All Projects - #100 of #100Days100Projects

10
Comments
1 min read
html{font-size:?} Responsive Magic

html{font-size:?} Responsive Magic

63
Comments 8
2 min read
Headdress: Home Page by Karim coda

Headdress: Home Page by Karim coda

4
Comments
1 min read
Animated SVG Signature

Animated SVG Signature

9
Comments 1
1 min read
Making Neon Light with Box-shadow property

Making Neon Light with Box-shadow property

7
Comments 1
1 min read
Pixel Art Time!

Pixel Art Time!

9
Comments 2
1 min read
CodePen of this week #2

CodePen of this week #2

38
Comments 3
1 min read
promises in JS

promises in JS

5
Comments
1 min read
To-do List With Local storage V2

To-do List With Local storage V2

6
Comments
1 min read
Here are my Trendy CSS logo loader and curtain effect tut

Here are my Trendy CSS logo loader and curtain effect tut

9
Comments
2 min read
amCharts 4: Chord Diagram with link toggling

amCharts 4: Chord Diagram with link toggling

9
Comments
1 min read
Harbiolar

Harbiolar

3
Comments
1 min read
#CodepenChallenge Tree: CSS Only Rotating Christmas Tree

#CodepenChallenge Tree: CSS Only Rotating Christmas Tree

9
Comments
1 min read
CodePen of this Week - A New Series

CodePen of this Week - A New Series

35
Comments 2
1 min read
Creating a fold out navigation with CSS only

Creating a fold out navigation with CSS only

323
Comments 39
4 min read
Pure CSS Slider Switch Light/Dark Theme

Pure CSS Slider Switch Light/Dark Theme

3
Comments
1 min read
Making magic with before and after pseudo elements ✨

Making magic with before and after pseudo elements ✨

34
Comments 1
4 min read
Demo: Font Awesome Pro CDN - SVG + JS

Demo: Font Awesome Pro CDN - SVG + JS

8
Comments
1 min read
Headdress: Home Page by Karim coda

Headdress: Home Page by Karim coda

3
Comments
1 min read
404 CV Not Found Landing Page

404 CV Not Found Landing Page

8
Comments
1 min read
basic calculator

basic calculator

5
Comments 1
1 min read
Backdrop filter

Backdrop filter

7
Comments
1 min read
CSS Tiles with Elevation

CSS Tiles with Elevation

6
Comments
2 min read
loading...