w3tweaks
  • Effects
    • Scroll Effects
    • Text Effects
    • Shadow
  • Essentials
    • Arrows
    • Buttons
    • Background Patterns
    • Border Examples
    • Cards
    • Color Palettes
    • Dividers
    • Link styles
    • Loaders
    • Modal Windows
    • Notifications
    • Progress bar
    • Quote styles
    • Spinner
    • Tooltips
  • Media
    • Calendars
    • Carousels
    • Clocks
    • Gallery
    • Music Players
    • Sliders
    • Slideshows
    • Tables
    • Thumbnails
  • Navigation
  • Inputs
    • Range Sliders
    • Checkboxes
    • Toggle Switches
  • Scripts
    • Angularjs
    • Backbone.js
    • bootstrap
    • jQuery
    • ReactJs
    • JavaScript
    • Syntax Highlighters
    • tryit editor
    • PHP
  • API’s
    • Facebook
    • Google
    • Indeed
    • Twitter
    • YouTube
w3tweaks
  • Effects
    • Scroll Effects
    • Text Effects
    • Shadow
  • Essentials
    • Arrows
    • Buttons
    • Background Patterns
    • Border Examples
    • Cards
    • Color Palettes
    • Dividers
    • Link styles
    • Loaders
    • Modal Windows
    • Notifications
    • Progress bar
    • Quote styles
    • Spinner
    • Tooltips
  • Media
    • Calendars
    • Carousels
    • Clocks
    • Gallery
    • Music Players
    • Sliders
    • Slideshows
    • Tables
    • Thumbnails
  • Navigation
  • Inputs
    • Range Sliders
    • Checkboxes
    • Toggle Switches
  • Scripts
    • Angularjs
    • Backbone.js
    • bootstrap
    • jQuery
    • ReactJs
    • JavaScript
    • Syntax Highlighters
    • tryit editor
    • PHP
  • API’s
    • Facebook
    • Google
    • Indeed
    • Twitter
    • YouTube
w3tweaks
Home Essentials
Social Flipping Icons

Social Flipping Icons

W3TWEAKS by W3TWEAKS
September 25, 2019
in Essentials
0

Horizontal flipping cards on CSS

Tutorial/codes – Demo

Author:
Nicola Markelov
Created:
OCTOBER 13, 2015
Made with:
HTML, CSS

Find the Demo

See the Pen Flipping Cards by Nicola Markelov (@nicolamarkelov) on CodePen.

You might also like

Pill Styled Radio ButtonsPill Styled Radio Buttons

Custom radio button using CSS only

December 10, 2020
3.3k
t-shirt cannon playful animated button concept

T-shirt cannon playful animated button concept

October 13, 2020
3.2k

Tags: cardscss hover effectsflip animationflip cardsHorizontal Fliphover animationHover effectsmouse hover effectssocial icons
Previous Post

Pure CSS Flip Card

Next Post

Cross-Browser Flip Card

W3TWEAKS

W3TWEAKS

Since I've had a strong background in front-end development, I took the initiative to start my own website (w3tweaks.com) to share my knowledge with the world.

Related Stories

Pill Styled Radio ButtonsPill Styled Radio Buttons

Custom radio button using CSS only

by W3TWEAKS
December 10, 2020
0
3.3k

Custom radio button style using only CSS (SCSS) by taking advantage of sibling selectors and the :checked psuedo class. See...

t-shirt cannon playful animated button concept

T-shirt cannon playful animated button concept

by W3TWEAKS
October 13, 2020
0
3.2k

Your shirt order blasts off from a t-shirt cannon in this playful button concept from Jhey, built with GSAP. See...

chat bubble smoothly morphs into a "close" X

Chat bubble smoothly morphs into a “close” X

by W3TWEAKS
October 13, 2020
0
3.2k

A chat bubble smoothly morphs into a "close" X in this elegant Pen from Mikael Ainalem. See the Pen Chat Bubble by...

Clipped Overlapping Grid Items

Clipped Overlapping Grid Items

by W3TWEAKS
September 30, 2020
0
3.2k

Hristovv demonstrates how `clip-path` can help build magazine-style photo layouts with CSS. See the Pen Clipped overlapping grid items by...

Next Post
Cross-Browser Flip Card

Cross-Browser Flip Card

Discussion about this post

We bring you the best frontend collections that will fix perfect for news, magazine, personal blog, etc. Check our landing page for details.

  • Effects
    • Scroll Effects
    • Text Effects
    • Shadow
  • Essentials
    • Arrows
    • Buttons
    • Background Patterns
    • Border Examples
    • Cards
    • Color Palettes
    • Dividers
    • Link styles
    • Loaders
    • Modal Windows
    • Notifications
    • Progress bar
    • Quote styles
    • Spinner
    • Tooltips
  • Media
    • Calendars
    • Carousels
    • Clocks
    • Gallery
    • Music Players
    • Sliders
    • Slideshows
    • Tables
    • Thumbnails
  • Navigation
  • Inputs
    • Range Sliders
    • Checkboxes
    • Toggle Switches
  • Scripts
    • Angularjs
    • Backbone.js
    • bootstrap
    • jQuery
    • ReactJs
    • JavaScript
    • Syntax Highlighters
    • tryit editor
    • PHP
  • API’s
    • Facebook
    • Google
    • Indeed
    • Twitter
    • YouTube

Welcome Back!

Sign In with Google
Sign In with Linked In
OR

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In