• Canal
  • Cannaregio district
  • Dorsoduro
  • Bright houses

Pure CSS Slideshow?

Generate beautiful image sliders entirely in CSS. No jQuery, no JavaScript, no picture icons, no scripting! It's truly smooth, lightweight, adaptive, and retina-ready. Runs well on all current devices and internet browsers. Rotate, Pan & Zoom, KenBurns, Fade, Slide animations and a number of skins are included. Download a slider builder for Windows and Mac now!

Absolutely no coding

Create your slider in seconds with the visual maker

Light-weight and compatible

Lightning page performance is a certainty due to it's not becoming slowed down by Java Script, as well as being designed to the most up to date technical guidelines to allow it to be super-compatible.

Impressive transitions

cssSlider includes remarkable pure CSS3, hardware-accelerated animations to impress your customers and help keep their attention concentrated on your own web page.

Exceptionally Customizable

Run css Slider generator in two different configuration modes: Basic and Advanced. Select from numerous built-in layout looks to keep things real simple, or dive in to edit the settings in whatever way you'd like for entire control.


All slider navigation controls are vector icon font and they're great on high resolution displays

CSS3 effects

Sleek and smooth hardware-accelerated animations work much better than jQuery ones, especially on devices

Additional Features

There's a huge amount of settings that you may tweak, including perfect transition effects and brilliant flat designs, prev/next navigation, bullets with thumbnails, auto play, pause/stop, full width, full screen and other options.

Painless to Use

Easy to use, you just assign a variety of templates, colors and effects from the collection to your slider. There's simply no knowledge of programming necessary in any way. You wont need to type a single line of code!

Beautiful designs

Select designs, colors and effects in the impressive compilation that is bundled and ready to go.

SEO Friendly

cssSlider is crafted with clear HTML5. It looks amazing and search engines are still able to crawl it perfectly. This will let you keep your website visitors and search engines both pleased at the same time!

Color Combos

Each cssSlider design has 6 pre-made color scheme to make your selection simpler.

KenBurns Effect & Basic Design Non Jquery Slider

This skin has a simple, minimalist feel that is clean and welcoming. The design uses only CSS, no JQuery or Javascript, which makes it incredibly quick to load, completely responsive and can be used on a wide variety of platforms, even ones with javascript disabled.

It uses two shades of pale blue and dark grey, which stop it from feeling too stark and simple.

There is no frame around the slider, which means images take center stage. Two navigational arrows display when you hover over the image. They seem drop into place from above, with a smooth fade. It is a slow and smooth transition effect. The arrow is a dark grey, thin arrow-head. It sits on a pale blue circle. Hovering over the arrow turns the circle white, and the arrowhead shifts left and right. The movement attracts the eye, and encourages the user to click on it.

Clicking on one of the arrows cycles the user through the images.

In the bottom-left corner is a caption, comprised of two titles. They both have grey text on a blue rectangle with rounded corners. The title rectangle is a slightly darker shade of blue, and the sub-title rectangle is a grey-ish, very light blue.

The title bounces in from above, and comes to a stop overlapping the sub-title rectangle. The sub-title bounces in from below. The text inside bounces even more, creating a realistic sense that the rectangles have come to a halt, and the inside text has been shaken in response. It is a very attractive and eye-catching transition, which still maintains the simple and clean design style of the template.

The font used is Open Sans Condensed, a humanist sans-serif typeface that is neutral, simple and yet friendly.

At the bottom of every slide are a number of blue circles. Each one indicates an image in the slideshow. The circle that represents the image on display in the slideshow has a grey dot in the center.

Hovering over a circle causes a preview image to display in a blue frame, and with a blue arrow at the bottom pointing to the correct circle. This preview image slides into place from above, in the same way as the navigational arrows.

Clicking on a circle loads the relevant image into the slider. This is a greta way to allow someone to navigate to the image most relevant to them.

The change effect on this demo is 'kenburns', a modern, simple transition where each image slowly zooms and fades into the next one. It is a change effect that creates a sense of constant, relaxed movement, like you are watching the world slip by. It works effectively with the simple but modern slider design.

This design is flexible enough to be used for almost any website that wants a modern, clean design. It is extremely professional looking, and would be perfect for technology websites, website builder software companies, and so on.