コード共有サイト CodePen で2013年に人気だった投稿ベスト100

100位～91位

The most hearted Pens of 2013 100位～91位 より

100位

Twitter Post Fetcher - compiled

99位

Menu toggle button

98位

CSS3 Card Deck Drop Down

97位

Some buttons...

96位

CSS3 pricing table

95位

Demo Flexbox 1

94位

Tunnel vision 3D CSS

93位

Chat (WebRTC)

92位

DYNAMIC INSIDE BLUR PURE CSS

91位

Pure CSS3 Vertical menu with nice hover effect

90位～81位

The most hearted Pens of 2013 90位～81位 より

90位

Circular minimal countdown

89位

Life timeline

88位

CSS Factory

87位

Clean Contact Form

86位

jQuery different scroll speeds

85位

Whale | SVG & JS

84位

CSShrome

83位

Line Menu Icon that Expands Into Actual Menu

82位

animated percentage indicator with Snap.svg

81位

Only CSS3 Dropdown Menu

80位～71位

The most hearted Pens of 2013 80位～71位 より

80位

Scroll-Triggered Animations (jQuery)

79位

Shade - Shadow Mixin

78位

Forest Encounter

77位

CSS3 Menu hover effects

76位

Sky gradients

75位

Responsive Shopping Cart

74位

Fluid Grid Using Text-align: Justify

73位

Pure CSS Code Editor

72位

Parallax-ImageScroll jQuery plugin - mobile fallback

71位

Line text.

70位～61位

The most hearted Pens of 2013 70位～61位 より

70位

Jquery & CSS3 background

69位

Tabbed Content with jQuery and CSS

68位

Equal Height and Width Columns using Flexbox

67位

Gallery prototype

66位

Twitter Card UI

65位

A Pen by zyklus

64位

Authentic Weather Loader

63位

Barberpole Hover Animation

62位

Dark Ui elements

61位

Responsive Organization Chart

60位～51位

The most hearted Pens of 2013 60位～51位 より

60位

Custom FIle Upload

59位

App landing page

58位

Night sky with twinkling stars - CSS3 only

57位

jQuery. Fly to cart effect.

56位

Responsive Infinite Carousel

55位

Very Simple Slider

54位

radio click through #2

53位

Fluid menu with transparent icons

52位

Animated SVG Path

51位

Smooth Gradient Backgrounds

50位～41位

The most hearted Pens of 2013 50位～41位 より

50位

Smoky Text

49位

Signature animation

48位

CSS3 Hover Effect using :after Psuedo Element

47位

Slider like Yahoo Weather App

46位

Kontext

45位

Solution for Long Drop Down Items

44位

Smooth Anchor Scrolling

43位

Flat UI Colors

42位

Parallax scrolling background

41位

Live CSS Blur

40位～31位

The most hearted Pens of 2013 40位～31位 より

40位

Email UI - Dribbble Rebound

39位

CSS Spinner Animation

38位

CSS3 flat icons

37位

Responsive Flat UI Kit

36位

Sexy Social Buttons

35位

SVG Doughnut chart with animation and tooltip

34位

The Great Fall

33位

Pure CSS Star Rating Widget

32位

Long shadow generator

31位

Opacity On Scroll

30位～21位

The most hearted Pens of 2013 30位～21位 より

30位

3D Carousel Gallery

29位

CSS arrow down bouncing

28位

Changing Background Color while scrolling

27位

Scroll Position Indicators

26位

Hair

25位

Mobile menu icon animations

24位

[webkit] Animated "text-shadow" pattern

23位

Multiplane Demo

22位

150 Animated SVG Icons

21位

Cool Buttons

20位～11位

The most hearted Pens of 2013 20位～11位 より

20位

Accessible Custom Checkboxes with CSS only

19位

Color Inspiration

18位

3D particles to a 2D canvas

17位

CSS-Only Countdown Clock

16位

motion graphic typeface.

15位

Sliding Vertical Nav

14位

CSS 3D X-wing

13位

Canvas Parallax Mountains

12位

Blur on Scroll + Simple Parallax

11位

Section Separator Inspiration

10位～1位

The most hearted Pens of 2013 10位～1位 より

10位

Fluid Simulation

9位

Pure CSS Lightbox

8位

Sakura Animation using WebGl

7位

SVG text mask

6位

Fluidbox (v1.3)

5位

Dropdown with Multiple checkbox select with jQuery

4位

:focus tooltip

3位

AngularJS BootStrap 3 Modal Dialogs

2位

Animated search Form

1位

Flexing pagination arrows

関連note