} /* SC_TH_END:4.5.3:1ffe1c48 */ Best 10 HTML5 and CSS Weather Widgets - Gpkumar.com

HTML

Posted byby Praveen Kumar
January 1, 2019

Best 10 HTML5 and CSS Weather Widgets

0 Comments
1 Min Read
1.3k Views

Best 10 HTML5 and CSS Weather Widgets – Collection of hand-picked free HTML and CSS weather widget code examples.

WEATHER WIDGET UI

Author: Amit Soni

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Dependencies: font-awesome.css

CSS WEATHER WIDGET

Simple weather widget in HTML and CSS.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

WEATHER WIDGET WITH CSS AND SVG: RAINING

Trying CSS animation for SVG clouds for weather widget.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

WEATHER CARD USING FLEXBOX

A sample weather widget design implemented using flexbox.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Dependencies:weather-icons.css

WEATHER WIDGET

A weather widget with subtle animations done using pure CSS.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

WEATHER WIDGETS

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Dependencies:font-awesome.css

WEATHER WIDGETS

CSS only weather widgets.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

WEATHER POPUP/WIDGET

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Dependencies:weather-icons.css

FLAT WEATHER NOTICE CARDS

Pure CSS3 and HTML5 animated weather notice cards.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Demo and code

CSS3 WEATHER WIDGET

Weather widget in HTML and CSS.

Compatible browsers:Chrome, Edge, Firefox, Opera, Safari

Written by

Praveen Kumar

I am a fullstack web developer with a passion for SEO, creating stunning websites, and organic marketing. I am a perfectionist.

back to top