LIVE PREVIEWBUY FOR $5

The Slider – pure CSS / HTML picture slider with fade animation.

Particular for non-technical customers, simply paste the html code and go.

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 1

The best solution to apply your picture slider on the web site witout any JS. Put your urls to photographs and begin utilizing! that every one!

OK! however why I would like pure css slider?

  • with Slider you’ll be able to simply create picture carousel with any HTML creator (WYSIWYG) that you’ve got entry to avoid wasting html with enter and elegance tag! For instance, weblog put up, wordpress web page, discussion board put up and so on.
  • you’ll spend much less time to put in difficult plugins and library in your mission – simply copy & previous,
  • efficiency is your key.
  • in your mission You don’t have entry to JS or there are NO-JS necessities.

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 2

Simple to begin however – it’s a very highly effective software! We’ve a whole lot of features.

Displaying photos – frozen ratio or auto ratio

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 3

The Slider has 5 varieties of ratio preset – 1:1, 2:1, 4:3, 16:9, 21:9, and likewise the guide mode (for instance you’ll be able to set 100% of window peak). You can too choose a picture that may cowl your area or include it.

Darkish mode

Darkish and light-weight mode – arrange your owns fashion for every mode – gentle and darkish – use css variables and begin to use darkish mode.

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 4

Animation – fade or transfer? or none

Responsive – slider is absolutely responsive

Full display mode

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 5

The slider has full display mode – may be swap by button – or use JS to vary enter checked() state

Two solution to navigate – as befits a slider

Pagination (indicators) with dots.

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 6

Navigation with two predefined fashion.

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 7

Image Slider - Pure CSS carousel with dark mode & fullscreen / less / sass - 8

Totally customizable – use CSS variables or LESS / SASS file with variables and mixin, colours, shadows, shapes of UI parts and so on.

That each one works solely with HTML and CSS, no want JS in any respect, this expertise is pure magic.

Be aware: With this plugin you’ve capacity to use any JS occasions or set off methodology on enter tag to control slider conduct (slide, activate/off fullscreen and so on) – it’s very straightforward.


Source