Css Grid Ribbon Layout

10.02.2018

Using CSS Grid to create a ribbon style text effect.

Made with: HTML,CSS,JavaScript

View Code

Css Grid Ribbon Layout

Card Flip

8.02.2018

3D card flip effect with a 3D button.

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

View Code

Card Flip

Bootstrap Menu For One Page

7.02.2018

One page Bootstrap + jQuery smooth scroll effect menu, if clicked menu item change active status and scroll to the section.

Made with: HTML,CSS,JS

View Code

Bootstrap Menu For One Page

Double Arrow Button

6.02.2018

Animate an arrow button on click or hover.

Made with: HTML

View Code

Double Arrow Button

Responsive Pure Css Image Gallery With Css Grid

6.02.2018

Here's one of an image gallery where you select the img you want to be showcased in the center. The layout is made possible with CSS grid. When switching to a smaller viewport you'll get a different experience that is made possible by altering the grid-template-columns and grid-template-rows.

Made with: HTML/Pug

View Code

Responsive Pure Css Image Gallery With Css Grid

Card Animation

6.02.2018

Card animation with CSS, HTML and some hover events.

Made with: HTML,CSS

View Code

Card Animation

Off-Canvas Navigation W/Page Transitions

6.02.2018

More experimentation with transitions and navigation. Decided to add in a little bit for page transitions as well.

Made with: HTML

View Code

Off-Canvas Navigation W/Page Transitions

Card Animation

6.02.2018

Card animation with CSS and HTML and some click events, CSS variables.

Made with: HTML,CSS,JS

View Code

Card Animation

Html5 And Css3 Only Simple And Responsive Fullscreen Menu

5.02.2018

A simple and responsive fullscreen menu. HTML5 and CSS3 only. No jQuery. IE11 friendly.

Made with: HTML,CSS

View Code

Html5 And Css3 Only Simple And Responsive Fullscreen Menu

Cristal Lands

5.02.2018

Cristal lands - yet another experiment with three.js library.

Made with: JavaScript

View Code

Cristal Lands

Css-Only Cube Pack

4.02.2018

Made with: HTML,CSS (SCSS)

View Code

Css-Only Cube Pack

Calculator

2.02.2018

Made with: HTML,CSS (SCSS)

View Code

Calculator

Sliding Blinds Effects

2.02.2018

Using CSS custom properties, we can get a pretty fun result.

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

View Code

Sliding Blinds Effects

Css Illustration Witch

2.02.2018

Created CSS only.

Made with: HTML,CSS

View Code

Css Illustration Witch

10 Scroll Down Arrows

1.02.2018

10 scroll down arrow examples.

Made with: HTML

View Code

10 Scroll Down Arrows

Sort Table Rows By Table Headers

1.02.2018

Sort table rows by table headers - ascending and descending.

Made with: HTML

View Code

Sort Table Rows By Table Headers

Download Button

1.02.2018

Used CSS transitions and animations, along with the lightweight animation library anime.js, and segment.js for SVG animations.

Made with: HTML,CSS (SCSS),JavaScript

View Code

Download Button

Toggles

1.02.2018

Useful toggle.

Made with: HTML

View Code

Toggles

Barcode Animation

31.01.2018

Made with: HTML,CSS

View Code

Barcode Animation