Elirena

Apple TV parallax Pure CSS

It is an experiment to create parallax effect with pure CSS3 animation.

A Pen by Nirajan Basnet on CodePen.

License.

Elirena

React Scroll Parallax

Experimenting with some scroll based parallax effects in React. Uses react-scroll-parallax which provides a react component and single passive scroll listener to add vertical scrolling based offsets to elements based on their position in the viewport.

A Pen by J Scott Smith on CodePen.

License.

Elirena

btn hover effects

A Pen by BrainUP on CodePen.

License.

Elirena

<div class="col">
  <div class="container-1">
    <div class="btn btn-one">
      <span>BUTTON ONE</span>
    </div>
  </div>

  <div class="container-2">
    <div class="btn btn-two">
      <span>IDLE</span>

Elirena

Button Hover Border Animations

Using pseudo elements to mimic an element's border with transition and alternating transform-origin on hover

A Pen by Sean Free on CodePen.

License.

Elirena

Animated CSS Icons

A bunch of animated CSS icons using BEMIT as CSS naming convention. Builded as component with relative units.

A Pen by Vivian on CodePen.

License.

Elirena

Icon Kit by ionicons

A Pen by Noor AL-Hassan on CodePen.

License.

Elirena

CSS Button Hover

Some CSS Pseudo Element hover effects. Feel free to copy code for your projects.

A Pen by Christopher Goodwin on CodePen.

License.

Elirena

Button Hover – Typewriter

Typewriter like hover effect. CSS only

A Pen by Florian Ludwig on CodePen.

License.

Elirena

.page
	.users

	script#user-template(type="text/x-handlebars-template")
		.user
			.photo
				img(src="{{photo}}")
			.info
				.name {{name}}
				.nickName {{userName}}