CSS Slideshows | Bypeople

deals

premiumpacks & css slideshows (34 items)

A set of slideshows created with CSS, enabling you to display different types of media in neat and dynamic fashion.

freebies

A pure CSS animated rotating image slider with awesome effects throughout by Codepen user Nathan Taylor. Both the images and the colored overlay ro...

A pure CSS animated rotating image slider with awesome effects throughout by Codepen user Nathan Taylor. Both the images and the colored overlay rotate as the slides change, switching colors as the animation continues.

A nice vertical split effect to create amazing photo slideshows

A nice vertical split effect to create amazing photo slideshows

Free mobile touch slider with lots of transitions and effects, ideal for mobile websites, mobile web apps, and mobile native/hybrid apps. Works in ...

Free mobile touch slider with lots of transitions and effects, ideal for mobile websites, mobile web apps, and mobile native/hybrid apps. Works in iOS, Android, Windows Phone 8 and modern Desktop browsers

150 Flat Illustrations Pack + Generator, Only $19: SVG, Sketch, Figma, Adobe XD & Ai Files, Web & Mobile UI Templates, High-Res Transparent PNG Exp...

150 Flat Illustrations Pack + Generator, Only $19: SVG, Sketch, Figma, Adobe XD & Ai Files, Web & Mobile UI Templates, High-Res Transparent PNG Exports, Premade Scenes, Commercial Use License

This layout contains two smarts features, mainly its presentation as a transitional page within presets images with smooth animation; and secondly ...

This layout contains two smarts features, mainly its presentation as a transitional page within presets images with smooth animation; and secondly an off canvas menu with a direct link to every image.

A beautiful code experiment in CSS for a different set of slideshows supporting multiple layouts. This allows the arrangement of elements in a uniq...

A beautiful code experiment in CSS for a different set of slideshows supporting multiple layouts. This allows the arrangement of elements in a unique way, making your site stand out. It uses 3d transforms and an animation library called anime.js.

A stunning slider that features Yoshi´s Island and uses a parallax effect to move through four different environments before reaching the final de...

A stunning slider that features Yoshi´s Island and uses a parallax effect to move through four different environments before reaching the final destination. It was made with Flickity, is full of colorful plants, animals and much more.

1000+ Photo Overlays, Only $14! 5k Resolution, 300 DPI, 13 Categories From Bubbles To Leaves & Natural Sunlight (87% Off)

1000+ Photo Overlays, Only $14! 5k Resolution, 300 DPI, 13 Categories From Bubbles To Leaves & Natural Sunlight (87% Off)

A cool snippet featuring a 3D circle slider that rotates sideways depending on the clicked arrow, showing several products, a perfect feature to in...

A cool snippet featuring a 3D circle slider that rotates sideways depending on the clicked arrow, showing several products, a perfect feature to include in your site.

A lightweight and open source slider developed in CSS and JS that features CSS animated elements.

A lightweight and open source slider developed in CSS and JS that features CSS animated elements.

SVG Hero Slider is a code snippet that allows creating smooth slider transitions layered by vector shapes. It comes along with a short tutorial tha...

SVG Hero Slider is a code snippet that allows creating smooth slider transitions layered by vector shapes. It comes along with a short tutorial that explains how it was created by Claudia Romano.

300+ Vector Illustrations Pack + Generator Kit, Only $17: Files In Ai & XD, Sketch, Figma, SVG & PNG Formats, Includes 50+ Premade Scenes & 100+ We...

300+ Vector Illustrations Pack + Generator Kit, Only $17: Files In Ai & XD, Sketch, Figma, SVG & PNG Formats, Includes 50+ Premade Scenes & 100+ Web & Mobile UI Templates, Generator File With All Components & Shapes, Commercial Use

This splitting image slideshow was created with pure CSS, showing several images that break apart into multiple pieces. Once this happens, the next...

This splitting image slideshow was created with pure CSS, showing several images that break apart into multiple pieces. Once this happens, the next image appears and the process repeats over and over. This creation was put together by Nate Wiley.

A gallery depth slider created with CSS and jQuery. It works by scrolling or selecting one of the dots so the sliding animation tooks place. It sho...

A gallery depth slider created with CSS and jQuery. It works by scrolling or selecting one of the dots so the sliding animation tooks place. It shows two images, one of them with the caption. This code snippet was created by Nikolay Talanov.

A plugin made with CSS and JavaScript, perfect for creating HTML presentations and slideshows. The presentations can be manipulated with the keyboa...

A plugin made with CSS and JavaScript, perfect for creating HTML presentations and slideshows. The presentations can be manipulated with the keyboard arrows, making it simple to navigate through them. It comes under the MIT license and it was created by Caleb Troughton.

Beginner To Advanced Adobe InDesign Course, Only $17: Over 10 Hours Of Content, 80+ Videos, Certificate Of Completion, Clear English Pronunciation,...

Beginner To Advanced Adobe InDesign Course, Only $17: Over 10 Hours Of Content, 80+ Videos, Certificate Of Completion, Clear English Pronunciation, Subtitles In English & Chinese, Beginner To Advanced Levels

A compelling image slider made with CSS composed of two stacks of cards from which images get "picked up". This experimental slider uses CSS 3D tra...

A compelling image slider made with CSS composed of two stacks of cards from which images get "picked up". This experimental slider uses CSS 3D transforms and perspective. This work in modern browsers perfectly, but still has some bugs.

A classy slider created and animated with pure CSS. It includes next and previous buttons (which come with neat transparencies) plus navigation dot...

A classy slider created and animated with pure CSS. It includes next and previous buttons (which come with neat transparencies) plus navigation dots. A fade/zoom out transition gives a styling touch to the project. All credit goes to CodePen user Avi Kohn.

Based on a Dribbble work by Subash Dharel, CodePen's Sara Soueidan has created this stylish set of boxes intended to be used to display testim...

Based on a Dribbble work by Subash Dharel, CodePen's Sara Soueidan has created this stylish set of boxes intended to be used to display testimonials, including pictures and a box for quoted text. The widget can contain multiple testimonials, thanks to smooth CSS transitions.

72 Display Fonts Bundle, Only $19: Desktop & Web, OTF, TTF, EOT, SVG, WOFF & WOFF2 File Formats, Includes Sans-Serif, Signature, Serif, Slab-Serif,...

72 Display Fonts Bundle, Only $19: Desktop & Web, OTF, TTF, EOT, SVG, WOFF & WOFF2 File Formats, Includes Sans-Serif, Signature, Serif, Slab-Serif, Rounded Font Styles & More

An awesome slideshow displayed in the shape of a half-circle. In order to explore through the images, simply click on the numbers below, as a neat ...

An awesome slideshow displayed in the shape of a half-circle. In order to explore through the images, simply click on the numbers below, as a neat animation will bring the corresponding picture. Project styled entirely with CSS by CodePen user Chris Mounsey.

A very simple slider, featuring a frame that goes around the image, as if it was hung on the wall. When hovering over the design, a set of dots ani...

A very simple slider, featuring a frame that goes around the image, as if it was hung on the wall. When hovering over the design, a set of dots animate into the view, allowing the user to browse through the pictures. This project was created with pure CSS by Joshua Hibbert.

A super smooth slider that allows the user to view the pictures in it by hovering over the thumbnails below. The images transition nicely between t...

A super smooth slider that allows the user to view the pictures in it by hovering over the thumbnails below. The images transition nicely between them, using only CSS. Additionally, the design in entirely in black and white, except for the images being seen at the moment, which appear in color. Created by Marco Barría.

Ornate Vector Animal Illustrations Pack, Only $17: Tribal/Ethnic Designs, Layered EPS Vector Files, 4 Color Variants Per Design, Unique & Colorful ...

Ornate Vector Animal Illustrations Pack, Only $17: Tribal/Ethnic Designs, Layered EPS Vector Files, 4 Color Variants Per Design, Unique & Colorful Illustrations

This project intends to provide an easy slider, coded with nothing more than HTML and CSS. It uses :target to work, so you might have to consider t...

This project intends to provide an easy slider, coded with nothing more than HTML and CSS. It uses :target to work, so you might have to consider the fact that it creates additional browser history steps when going through slides. Uploaded to CSS Deck by Joshua Hibbert.

This code snippet prevents page jumps every time the user switches between slides. This is achieved with the help of a checkbox or radio hack techn...

This code snippet prevents page jumps every time the user switches between slides. This is achieved with the help of a checkbox or radio hack technique in order to access each slide with a :checked selector, all with pure CSS. The slideshow also includes transition effects and is cross-browser compatible.

A very simple image slider brought to life with nothing but CSS. The idea is to have a set of images that change automatically after a few seconds,...

A very simple image slider brought to life with nothing but CSS. The idea is to have a set of images that change automatically after a few seconds, but you can stop them by hovering on the design, which also triggers a subtle zooming effect. All credit goes to CSSDeck's Daniel Henriquez.

31 Packs in 1 Huge Bundle: 200+ Low Poly 3D People Models, 3DS, OBJ, FBX, STL File Formats for VR, AR, Architectural Visualization, and Scale Graph...

31 Packs in 1 Huge Bundle: 200+ Low Poly 3D People Models, 3DS, OBJ, FBX, STL File Formats for VR, AR, Architectural Visualization, and Scale Graphics Projects! Only 29$ (82% Off)

This design intends to recreate the famous Cover Flow feature found in many Apple products. You can either click on the numbers below or directly o...

This design intends to recreate the famous Cover Flow feature found in many Apple products. You can either click on the numbers below or directly on the images to select them. You can also find a subtle reflection effect, everything with pure CSS. Uploaded to CodePen by Chris Mounsey.

This thorough Codrops tutorial will guide you through the creation of a neat slideshow with a parallax effect, taking advantage of a few CSS3 prope...

This thorough Codrops tutorial will guide you through the creation of a neat slideshow with a parallax effect, taking advantage of a few CSS3 properties. The idea is to control the slides with radio buttons, having two background images that transition at different speeds, generating the parallax effect.

A fancy Codrops project for creating a set of sliding image panels by using only CSS. The concept relies on a set of panels with background images ...

A fancy Codrops project for creating a set of sliding image panels by using only CSS. The concept relies on a set of panels with background images (plus titles and sub-text) that animate when clicking on a label. It comes with four different animations, all working smoothly in browsers with CSS transition compatibility.

530+ Desktop & Mobile Wireframes Kit For Sketch & Figma: 571 Base Elements, Nested Symbols, Custom Icons, Text & Layer Styles, Bootstrap 1170 Grid,...

530+ Desktop & Mobile Wireframes Kit For Sketch & Figma: 571 Base Elements, Nested Symbols, Custom Icons, Text & Layer Styles, Bootstrap 1170 Grid, 12 Templates, 22 Categories, Only $39 For Commercial Use

This very fun project for displaying pictures runs a super fast slideshow when hovering on the images. When the mouse is moved away, the current im...

This very fun project for displaying pictures runs a super fast slideshow when hovering on the images. When the mouse is moved away, the current image is displayed. Hover again to get a new picture in the frenzy roulette. You can choose to add titles on top or leave the image clean.

More of an experiment than an actual functional design, this pen has a go at creating a slider that displays images in full screen and includes thu...

More of an experiment than an actual functional design, this pen has a go at creating a slider that displays images in full screen and includes thumbnails for different albums on top. Arrows on the sides also aid you with navigation. Designed by John Motyl Jr using pure CSS.

Display tabbed content with this simple code snippet created with pure CSS. The blue section on the bottom allows you to go through sections, while...

Display tabbed content with this simple code snippet created with pure CSS. The blue section on the bottom allows you to go through sections, while a smooth animation moves the elements around accordingly. Moreover, a nicely texturized background wraps up the design. Uploaded by CodePen user Scott Magdalein.

400+ Web Flowcharts & Wireframe Blocks Pack, Only $24: Fully Editable Sketch Files, Userflows, Roadmaps, Printable Screens, 17+ Wireframe Block Cat...

400+ Web Flowcharts & Wireframe Blocks Pack, Only $24: Fully Editable Sketch Files, Userflows, Roadmaps, Printable Screens, 17+ Wireframe Block Categories Like E-Commerce, Profile, Headers/Footers, Splash, Forms & More, Commercial Use

This tutorial shows you how to create an amazing photo stack filled with all sorts of cool animations and transition effects when going through ima...

This tutorial shows you how to create an amazing photo stack filled with all sorts of cool animations and transition effects when going through images. Everything is created with pure CSS3, ensuring smooth playback in modern browsers and even mobile devices.

A neat freebie pack including three different minimalist sliders that allow you to showcase content with a clean presentation. The images slide wit...

A neat freebie pack including three different minimalist sliders that allow you to showcase content with a clean presentation. The images slide with a subtle fade effect, for an event smoother interface. They come with their respective PSD and HTML templates, just because we love to please you.

This freebie provides you with two clean, polished sliders so you can display content in an uncomplicated way to your visitors. They come with thei...

This freebie provides you with two clean, polished sliders so you can display content in an uncomplicated way to your visitors. They come with their respective PSD files and HTML templates, allowing you to apply any modifications as you see fit. Resource hosted at Elemis.

500 Fresh Stock Photos Pack, Only $17: 4k - 7k Resolution JPG Files, 10 Organized Categories, Alpine Peaks, Landscapes & Seascapes, Animals, Snowy ...

500 Fresh Stock Photos Pack, Only $17: 4k - 7k Resolution JPG Files, 10 Organized Categories, Alpine Peaks, Landscapes & Seascapes, Animals, Snowy Mountains & Cabins, Seasons, Nature & More!

As a follow-up to their vertical version of this same resource, the guys at Elemis Freebies are now giving away the template for this delightful ho...

As a follow-up to their vertical version of this same resource, the guys at Elemis Freebies are now giving away the template for this delightful horizontal new carousel, useful for different types of posts and articles. It comes in both light and dark colors and displays thumbnails, headers and sub-text.

The guys at Elemis Freebies are giving out this fantastic template for a vertical carousel in both light and dark color alternatives. This tool can...

The guys at Elemis Freebies are giving out this fantastic template for a vertical carousel in both light and dark color alternatives. This tool can be very useful to showcase news, posts, articles and related content in a clean way, providing thumbnail, headline and sub-text to catch the reader's attention.

This slideshow avoids the creation of new browser history steps when browsing through the images, like is the case with other similar tools. To ach...

This slideshow avoids the creation of new browser history steps when browsing through the images, like is the case with other similar tools. To achieve this result, CSSDeck user simonpicos makes use of radio input buttons with the :checked pseudo-class to take control of the slides.

2300+ Inspirational Social Media Quotes & Textures/Backgrounds Pack, Only $19: 1300+ High-Resolution Textures & 1000+ Quotes W/ Editable Texts, Tex...

2300+ Inspirational Social Media Quotes & Textures/Backgrounds Pack, Only $19: 1300+ High-Resolution Textures & 1000+ Quotes W/ Editable Texts, Texture Dimensions From 3000x2000px To 6000x4000px, Commercial Use

This amazing free slider displays four different images with their respective text sections, going through them smoothly while making full use of t...

This amazing free slider displays four different images with their respective text sections, going through them smoothly while making full use of the power of CSS3's animation property. Keep in mind, however, that this interesting resource might not work in Opera and IE, since they do not support all of its CSS3 features.