Image Selector With Reflection
Using a radio buttons to select an image with some styling.
Made with: HTML,CSS
Css Anime Effect
CSS anime hover effect with mix-blend-mode.
Made with: HTML (Pug),CSS (SCSS)
Luminance Edge
Image with luminance edges in HTML, CSS and SVG.
Made with: HTML (Pug),CSS (Less)
Image Hover Effect
Image hover effect with slice transition.
Made with: HTML (Pug),CSS (SCSS)
Red Dead Redemption 2 Tintype Photo Reveal
Here's a simple recreation of the Red Dead Redemption 2 loading screen tintype photo transition effect. It uses a CSS animation to slide an ink reveal sprite sheet. This was inspired by the Codrop article "Transition Effect with CSS Masks" by Robin Delaporte.
Made with: HTML,CSS
Portfolio Items With Five Transition Effects
Five transition effects for portfolo image items. Pure CSS.
Made with: HTML,CSS (SCSS)
The Other Half
background-size & background-position are animatable.
Made with: HTML,CSS,JavaScript
Image Transition: Water Your Cat
Compact and clean code. No Edge support due to CSS variable/ calc() bugs.
Made with: HTML (Pug),CSS (SCSS)
