Fipping Business Card

31.10.2018

Interactive card design with background-clip: text + background: linear-gradient animation.

Made with: HTML,CSS (SCSS)

View Code

Fipping Business Card

A Dribble Design Implementation

31.10.2018

Playing around with carousel animations.

Made with: HTML,CSS (SCSS),JS

View Code

A Dribble Design Implementation

Spinner Animation

31.10.2018

Made with: HTML,CSS (Less)

View Code

Spinner Animation

Fashion Concept

30.10.2018

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

View Code

Fashion Concept

Pure Css Animated Search Bar

30.10.2018

Animated seach box using pure HTML & CSS.

Made with: HTML,CSS

View Code

Pure Css Animated Search Bar

Custom Select Box

30.10.2018

Custom select box dropdown styling.

Made with: HTML,CSS

View Code

Custom Select Box

Responsive Css Grid Magazine Layout - 2

29.10.2018

Responsive magazine layout using CSS Grid. Best viewed at 1280px.

Made with: HTML,CSS (SCSS)

View Code

Responsive Css Grid Magazine Layout - 2

Css Animation: A Line Graph

29.10.2018

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

View Code

Css Animation: A Line Graph

Hover Effect For Boxes

29.10.2018

Hover effect for boxes in HTML and CSS.

Made with: HTML,CSS (SCSS)

View Code

Hover Effect For Boxes

Triangle Cutout

29.10.2018

Triangle cutout with pseudo-elements.

Made with: HTML,CSS (SCSS)

View Code

Triangle Cutout

Send Button Transforms Into Birds

28.10.2018

A CSS animation of a send button transforming into flying birds when clicked.

Made with: HTML,CSS (SCSS),JS

View Code

Send Button Transforms Into Birds

Sexy Fullscreen Menu

28.10.2018

Sexy fullscreen menu with sexy links in HTML and CSS.

Made with: HTML,CSS

View Code

Sexy Fullscreen Menu

Image Cutout, Parallax Effect: Css + Svg

28.10.2018

This works on desktop/laptop, but not on mobile. Make an SVG cutout of the same background color as your background. Make a parallax background with CSS. Use the same proportions as your SVG. Place an img of your SVG inside the HTML for your parallax div. Align and size parallax background as you like. Don't forget to make things responsive!

Made with: HTML,CSS

View Code

Image Cutout, Parallax Effect: Css + Svg

Responsive Css Grid Magazine Layout - 1

28.10.2018

Responsive magazine layout using CSS Grid. Best viewed at 1280px.

Made with: HTML,CSS (SCSS)

View Code

Responsive Css Grid Magazine Layout - 1

Pricing Table

27.10.2018

Pure CSS pricing table.

Made with: HTML,CSS (SCSS)

View Code

Pricing Table

Timeline

27.10.2018

Timeline custom counter with gradient border.

Made with: HTML,CSS (SCSS)

View Code

Timeline

Profile Card Ui Design

27.10.2018

Profile card UI design with cool hover effect.

Made with: HTML,CSS

View Code

Profile Card Ui Design

Sketchy Border

26.10.2018

Using 8 border-radius values can be pretty dope. This example shows how using it on the element and its ::before pseudo element can create a sketchy look and feel.

Made with: HTML,CSS (SCSS)

View Code

Sketchy Border

Button Emoji Animation

26.10.2018

Made with: HTML,CSS (SCSS)

View Code

Button Emoji Animation

Wave Button

26.10.2018

Hover the button to ride the wave!

Made with: HTML,CSS

View Code

Wave Button