Home > Code stuff > Image sliders > Hero slider animation with SVG

Hero slider animation with SVG

Code

A tutorial for creating a full page slider with animated SVG elements used as transition effects. Coded by the guys behind CodyHouse.

View demo View project page

Posted on August 26, 2015 in Code stuff, Image sliders and tagged sliders, svg. This post has been viewed 4889 times.

Twitter
Facebook
Google
Pinterest

Ready to use Graphic Assets

Related Freebies

An awesome CSS collection of navigation indicators for pages, slideshows and other components that tells the user where he is currently.

September 3, 2016

CSS Collection of navigation indicators for slideshow

Code

Bytesize is a free set of 75+ SVG icons that you can easily style adjusting the weight, colour, size, and if you want the edges to be round or square.

August 18, 2016

Bytesize: A style-controlled SVG icon set

Code

A free for commercial use set of 100 line icons in SVG, Ai, EPS and PNG formats designed for Tyler Brooks Designs annual report.

June 26, 2016June 26, 2016

100 Free vector line icons

A fresh set of 24 unique user interface outline icons in SVG and Sketch formats that you may find useful to build admin or dashboard pages.

June 13, 2016

24 Unique user interface icons

Sketch

You should try this

Hemma: A WordPress theme for Holiday Houses

Recent Freebies

OAK is a free HTML portfolio template ideal for designers, photographers and any kind of creative people who need a website for showcasing their own works.

July 22, 2017

OAK: A free HTML template for creative portfolios

Exclusive

Code

Brisk Pro is a free sans serif font ideal for headlines and logotypes characterised by geometric shapes and rounded edges.

July 17, 2017

Brisk Pro: Free font

Font

$fractures: An atomic CSS toolkit for building websites$

fractures is a CSS toolkit providing a set of CSS utility classes that may be used for quick prototyping as well as for production.

July 11, 2017

fractures: An atomic CSS toolkit for building websites

Code

Agata Bielen is a fashion magazine template designed by Adrián Somoza. It is a PSD file made of 3 screens based on a Golden Ratio grid.

July 7, 2017

Agata Bielen: Free PSD magazine template

PSD

t-scroll is a reveal-on-scroll JavaScript library for creating custom element animations when scrolling a web page, is built in pure JavaScript and Sass.

July 2, 2017

t-scroll: A modern reveal-on-scroll JS library

Code

Wavehaus Sans is a free font family designed by Graham Paterson. The typeface comes in 6 weights (Thin, Light, Book, Semibold, Bold and Extra Bold).

June 27, 2017June 27, 2017

Wavehaus Sans: A free typeface in 6 weights

Font

Share this

Search Freebie

Envato