39+ CSS Calendars | CSS Calendar Templates

CSS GRID: CALENDAR

Demo image: CSS Grid: Calendar

Author

  • Olivia Ng

Made with

  • HTML (Pug) / CSS (SCSS)

CSS CALENDAR UI DESIGN

HTML calendar UI design with CSS Grid.

Demo image: CSS Calendar UI Design

Author

  • mrnobody

Made with

  • HTML / CSS (SCSS)

CALENDAR MOBILE APP UI

Calendar mobile app UI in HTML and CSS.

Demo image: Calendar Mobile App UI

Author

  • Eliza Rajbhandari

Made with

  • HTML / CSS (SCSS)

CSS GRID CALENDAR

HTML calendar with CSS Grid.

Demo image: CSS Grid Calendar

Author

  • Mert Cukuren

Made with

  • HTML (Pug) / CSS (SCSS)

CALENDAR PLAN – TASKS EVENTS APP

 

Demo image: Calendar Plan - Tasks Events App

Author

  • Ahmed Nasr

Made with

  • HTML / CSS (SCSS)

LIGHT & DARK CALENDAR

 

Demo image: Light & Dark Calendar

Author

  • BradleyPJ

Made with

  • HTML / CSS (SCSS)

CSS GRID CALENDAR

HTML and CSS grid calendar.

Demo image: CSS Grid Calendar

Author

  • Adrià

Made with

  • HTML
  • CSS

SIMPLE CALENDAR

Clean and modern simple calendar.

Demo image: Simple Calendar

Author

  • jpag

Made with

  • HTML
  • CSS/LESS
  • JavaScript (jQuery.js)

DUOTONE CALENDAR

Duotone image with SVG filter.

Demo image: Duotone Calendar

Author

  • yumeeeei

Made with

  • HTML
  • CSS/Stylus
  • JavaScript (jQuery.js)

FLUENT DESIGN: CALENDAR

Microsoft’s Fluent Design with depth video cocept.

Demo image: Fluent Design: Calendar

Author

  • Antoinette Janus

Made with

  • HTML (Pug) / CSS (SCSS) / JavaScript

CALENDAR UI

Calendar with events in HTML and CSS.

Demo image: Calendar UI

Author

  • Alex Cramer

Made with

  • HTML
  • CSS

CALENDAR MOCKUP

CSS only calendar mockup.

Demo image: Calendar Mockup

Author

  • Jamie

Made with

  • HTML
  • CSS
  • JavaScript

WINDOWS FLUENT DESIGN CALENDAR

Demo image: Windows Fluent Design Calendar

Author

  • Tom

Made with

  • HTML
  • CSS

CALENDAR UI

Monthly calendar UI in HTML and CSS.

Demo image: Calendar UI

Author

  • Davide Francesco Merico

Made with

  • HTML/Pug
  • CSS/SCSS

CALENDAR

Simple calendar cards.

Demo image: Calendar

Author

  • Jocelyn

Made with

  • HTML
  • CSS/SCSS
  • JavaScript

DYNAMIC DATA CALENDAR

Calendar with dynamic data.

Demo image: Dynamic Data Calendar

Author

  • Nikita Dubko

Made with

  • HTML/Pug
  • CSS/SCSS
  • JavaScript (jQuery.js)

PARALLAX FLIPPING CALENDAR

Flipping calendar with HTML, CSS and little JS.

Demo image: Parallax Flipping Calendar

Author

  • Andreas Pihl Jrgensen

Made with

  • HTML
  • CSS
  • JavaScript (jQuery.js)

Calendar

 

Demo Image: Calendar

Author

  • Benjamin

Made with

  • Html / CSS
Demo and Download Demo and Download

It’s A Calendar Sort Of Thing

Calendar with nice animations & interactions.

Demo Image: It's A Calendar Sort Of Thing

Author

  • Jack Thomson

Made with

  • Html / CSS
Demo and Download Demo and Download

Infinite Calendar

A liquid & ‘light-weight’ calendar. There’s no libraries in this exercise, it’s really hand-crafted.

Demo Image: Infinite Calendar

Author

  • Tadaima

Made with

  • Html / CSS
Demo and Download Demo and Download

Responsive Calendar

Flexbox responsive calendar.

Demo Image: Responsive Calendar

Author

  • Gabi

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar Mockup

Very quick mockup of calendar.

Demo Image: Calendar Mockup

Author

  • Dan Couper

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar

Calendar with HTML, CSS and JS.

Demo Image: Calendar

Author

  • Dali

Made with

  • Html / CSS / JS
Demo and Download Demo and Download

Circular Calendar Display

 

Demo Image: Circular Calendar Display

Author

  • Matthew Juggins

Made with

  • Html / CSS
Demo and Download Demo and Download

React Date Range Picker

Date picker using React with select a range of dates.

Demo Image: React Date Range Picker

Author

  • Rob Vermeer

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar In ReactJs

Calendar using ReactJs (beginner level).

Demo Image: Calendar In ReactJs

Author

  • Ricardo Barbosa

Made with

  • Html / CSS
Demo and Download Demo and Download

Date And Time Picker

Date and time picker directive.

Demo Image: Date And Time Picker

Author

  • Jarom Vogel

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar App

This is a calendar application. you can browse dates and selecting single dates. You can schedule events on future days.

Demo Image: Calendar App

Author

  • Joey Lea

Made with

  • Html / CSS
Demo and Download Demo and Download

jQuery Datepicker Summer Vibe

Simple styling of the jQuery UI datepicker.

Demo Image: jQuery Datepicker Summer Vibe

Author

  • Håvard Brynjulfsen

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar And Clock

Calendar and clock with HTML, CSS and JavaScript.

Demo Image: Calendar And Clock

Author

  • mselmany

Made with

  • Html / CSS / JS
Demo and Download Demo and Download

CSS-only Colorful Calendar Concept

 

Demo Image: CSS-only Colorful Calendar Concept

Author

  • David Khourshid

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendar

Calendar with HTML, CSS and JavaScript.

Demo Image: Calendar

Author

  • Mark

Made with

  • Html / CSS / JS
Demo and Download Demo and Download

Flexbox Calendar

Responsive flexbox calendar with retina images.

Demo Image: Flexbox Calendar

Author

  • Dudley Storey

Made with

  • Html / CSS
Demo and Download Demo and Download

Haml Calendar

HTML and CSS calendar.

Demo Image: Haml Calendar

Author

  • Katy DeCorah

Made with

  • Html / CSS
Demo and Download Demo and Download

Calendario

A flexible calendar plugin.

Demo Image: Calendario

Author

  • Romswell Roswell Parian Paucar

Made with

  • Html / CSS
Demo and Download Demo and Download

Bootstrap Compatable Calendar

Bootstrap calendar.

Demo Image: Bootstrap Compatable Calendar

Author

  • Bill Barry

Made with

  • Html / CSS
Demo and Download Demo and Download

Event Calendar Widget

A nice looking calendar with nice transistions.

Demo Image: Event Calendar Widget

Author

  • Paul Navasard

Made with

  • Html / CSS
Demo and Download Demo and Download

Datepicker();

Datepicker in HTML, CSS and JavaScript.

Demo Image: datepicker();

Author

  • White Wolf Wizard

Made with

  • Html / CSS / JavaScript
Demo and Download Demo and Download

Calendar

Calendar with HTML, CSS and JavaScript.

Demo Image: Calendar

Author

  • B8bop

Made with

  • Html / CSS / JavaScript
Demo and Download Demo and Download

Post navigation