Minimalist Clock

6.11.2018

Minimalist clock, pure CSS with current time.

Made with: HTML,CSS (SCSS),JavaScript

View Code

Minimalist Clock

Background And Text Scroll Effect

6.11.2018

Super quick idea for a text reveal effect on scroll.

Made with: HTML,CSS (SCSS),JavaScript (Babel)

View Code

Background And Text Scroll Effect

Responsive Jquery Accordion

6.11.2018

A responsive jQuery accordion that allows the user to navigate from form to form by clicking on tabs, using the arrow keys and clicking on the provided arrow buttons. Created using jQuery and Bootstrap.

Made with: HTML,CSS,JS

View Code

Responsive Jquery Accordion

Flying Carrot

5.11.2018

Made with: HTML (Haml),JS (Babel)

View Code

Flying Carrot

Parallax Shadows (Mobile-Friendly)

5.11.2018

Made with: HTML,CSS,JS

View Code

Parallax Shadows (Mobile-Friendly)

Tab Bar Photo/Video Switch

5.11.2018

Pure CSS tab bar photo/video switch.

Made with: HTML,CSS (SCSS)

View Code

Tab Bar Photo/Video Switch

Gameboy Tetris Clone

5.11.2018

A simple javascript version of Tetris for the GameBoy. Although it's pretty similar to every version of Tetris. Uses p5.js for drawing!

Made with: HTML,CSS,JS

View Code

Gameboy Tetris Clone

Parallax Shadows

5.11.2018

Mobile-friendly parallax shadows.

Made with: HTML,CSS,JavaScript

View Code

Parallax Shadows

Pulse Cta Button

5.11.2018

Made with: HTML,CSS (SCSS)

View Code

Pulse Cta Button

Responsive Preloader

5.11.2018

Three dot animated responsive preloader.

Made with: HTML,CSS (SCSS)

View Code

Responsive Preloader

Pure Css Skeleton Loading Animation With Shimmer

4.11.2018

Improve perceived performance with a fancy skeleton loading animation.

Made with: HTML,CSS (SCSS)

View Code

Pure Css Skeleton Loading Animation With Shimmer

Css Grid Ecommerce Layout

4.11.2018

Playing card CSS Grid eCommerce layout.

Made with: HTML,CSS

View Code

Css Grid Ecommerce Layout

Red Dead Redemption 2 Tintype Photo Reveal

3.11.2018

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

View Code

Red Dead Redemption 2 Tintype Photo Reveal

Skewed Ecommerce Cards

3.11.2018

Responsive eCommerce product card layout using CSS Grid.

Made with: HTML,CSS

View Code

Skewed Ecommerce Cards

3D Css Parallax Depth Effect

2.11.2018

Playing with CSS translate and rotate transforms based on mousemove (sorry mobile users) to simulate some z-axis depth on the card and individual movie characters.

Made with: HTML,CSS (SCSS),JavaScript (Babel)

View Code

3D Css Parallax Depth Effect

Css Train 404 Page

2.11.2018

SVG 404 error page CSS only.

Made with: HTML,CSS

View Code

Css Train 404 Page

Animation Progress Bars

1.11.2018

Progress bars with CSS animation.

Made with: HTML,CSS (SCSS)

View Code

Animation Progress Bars

Candles (Pure Css Animation)

1.11.2018

Made with: HTML,CSS (SCSS)

View Code

Candles (Pure Css Animation)

Candles Pure Css Animation

1.11.2018

Made with: HTML,CSS (SCSS)

View Code

Candles Pure Css Animation

Boulder Badge

31.10.2018

Pure CSS illustration based on design by Patrick Moriarty.

Made with: HTML (Pug),CSS (SCSS)

View Code

Boulder Badge