Adaptive Photo Layout

18.09.2019

Made with: HTML,CSS (SCSS)

View Code

Adaptive Photo Layout

Responsive Flexbox Expanding Panels

1.09.2018

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

View Code

Responsive Flexbox Expanding Panels

Flexbox Cards

13.05.2018

Same height cards with hover effect.

Made with: HTML,CSS

View Code

Flexbox Cards

Flexbox Image Carousel

29.04.2018

A simple images carousel using Flexbox layout and jQuery.

Made with: HTML,CSS,JS

View Code

Flexbox Image Carousel

Flexbox Toggles

31.10.2017

Made with: HTML,CSS (Less)

View Code

Flexbox Toggles

Flexbox Image Slider

3.08.2017

A simple Flexbox image slider/carousel made with vanilla JavaScript.

Made with: HTML,CSS (SCSS),JS

View Code

Flexbox Image Slider

Css Thumbnail Responsive Flexbox Hover Transition

1.08.2017

A quick example to play around with flexbox hover transition.

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

View Code

Css Thumbnail Responsive Flexbox Hover Transition

Material Cards Flexbox

24.05.2017

Made with: HTML,CSS (SCSS),JS

View Code

Material Cards Flexbox

Flexbox Flex-Grow Mast

19.04.2017

Flexbox was used for the four column layout with a hover transition on flex-grow.

Made with: HTML,CSS (SCSS)

View Code

Flexbox Flex-Grow Mast

Flexbox Calculator

6.03.2017

A calculator written in vanilla JavaScript.

Made with: HTML (Pug),CSS (SCSSs),JS (Babel)

View Code

Flexbox Calculator

Flexbox Timeline Layout

9.01.2017

Column-based flexbox timeline layout. The goal is to have clean, semantic HTML while creating a (somewhat complex) timeline-looking layout.

Made with: HTML,CSS (SCSS)

View Code

Flexbox Timeline Layout

Css Responsive Full Screen Duo Layout With Animated Overlay

27.12.2016

Using Flexbox and viewport units, we creat a fluid two column layout for a fictional shoe brand, then boost it with CSS animations and transitions to make the interactions more interesting and fun.

Made with: HTML,CSS,JS

View Code

Css Responsive Full Screen Duo Layout With Animated Overlay

Travel Gallery

8.10.2016

Flexbox and CSS animations/transitions.

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

View Code

Travel Gallery

Super Best Flexbox Grid

27.08.2016

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

View Code

Super Best Flexbox Grid

Skewed Flexbox Panels

11.05.2016

Experimenting with skew transforms applied to a series of flexbox panels. Switches the flex-direction to columns for smaller screen sizes. Click the toggle button to see panel transitions without background images.

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

View Code

Skewed Flexbox Panels

Fullscreen Menu Flexbox Method

17.03.2016

Made with: HTML (Slim),CSS (SCSS),JS

View Code

Fullscreen Menu Flexbox Method

Fullscreen Flexbox Overlay Navigation

8.01.2016

Made with: HTML,CSS,JS

View Code

Fullscreen Flexbox Overlay Navigation

Neon Grid Loaders

25.07.2015

4 variations of a loading indicator using the same Flexbox grid system.

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

View Code

Neon Grid Loaders