Skip to content

DEV Community

𝕊𝕒𝕚𝕛𝕠 𝔾𝕖𝕠𝕣𝕘𝕖

Posted on Nov 13, 2019

32

4

Code snippets to recreate those cool effects seen on famous(ish) sites

#html #css #design

Today we will be looking at some snippets you can use to recreate those awesome effects you see on other sites.

Reebok Promo Image Transition - Codepen

The gradient pull quote as seen on Polygon - Codepen

Facebook's scroll down to show sticky video popup - Codepen

Soldout Window sign from Electronic Object - Codepen

Stripe's navigation header - Codepen

The squiggle link effect as seen on TheOutline - Codepen

MomentsApp Video Loading - Codrops

Want more check out the deconstruction gallery on CodeMyUI.

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Top comments (2)

Subscribe

niyasrahman • Nov 14 '19

happy to see you in dev.to .a big fan of your side-projects

𝕊𝕒𝕚𝕛𝕠 𝔾𝕖𝕠𝕣𝕘𝕖 • Nov 14 '19

Thanks Niyas.

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Read next

All About CORS Headers

Sam - Mar 5

Open Source Licensing Tips for Indie Hackers: A Guide to Navigating the Maze

Vitali Sorenko - Mar 5

Exploring Open Source Licensing Models in the Blockchain Era: A Deep Dive

Rachel Duncan - Mar 5

Autoshow - Automatic Show Notes for Podcasts and Videos

Alex Patterson - Mar 5