Alarm animation with white drop shadow

Developer
Ann Kwilinski
Size
9,164 Kb
Views
58,696
  1. Alarm animation with white drop shadow Previews
  2. Alarm animation with white drop shadow HTML Codes
  3. Alarm animation with white drop shadow CSS Codes
  4. Alarm animation with white drop shadow JS Codes

How do I make an alarm animation with white drop shadow?

A little animation of an alarm going off and coffee cup steaming for a jquery time-of-day plugin. What is a alarm animation with white drop shadow? How do you make a alarm animation with white drop shadow? This script and codes were developed by Ann Kwilinski on 25 July 2022, Monday.

Alarm animation with white drop shadow Previews
IQ Test

Alarm animation with white drop shadow - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Alarm animation with white drop shadow</title> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container"> <div class="timeofday"> <svg xmlns="http://www.w3.org/2000/svg" height="200" width="200" viewBox="0 0 200 200" enable-background="new 0 0 200 200" xml:space="preserve">	<defs>	<filter xmlns="http://www.w3.org/2000/svg" id="shadow" height="130%">
<!--white shadow-->
<feColorMatrix in="SourceAlpha" type="matrix" values="-1 0 0 0 1, 0 -1 0 0 1, 0 0 -1 0 1, 0 0 0 1 0" result="matrix"/>
<feGaussianBlur in="matrix" stdDeviation="0"/>	<feOffset dx="3" dy="3" result="offsetblur"/>	<feComponentTransfer>	<feFuncA type="linear" slope="0.2"/>	</feComponentTransfer>	<feMerge>	<feMergeNode/>	<feMergeNode in="SourceGraphic"/>	</feMerge>	</filter>
</defs>
<!--alarm clock-->
<path class="alarm" filter="url(#shadow)" d="M40.2,49.6c-0.4-0.6-0.7-1.1-1.1-1.7c-0.2-0.3-0.5-0.5-0.8-0.9C37,48,35.8,49,34.5,49.9c-1.2,0.9-2.5,1.8-3.8,2.7	c-0.9,0.6-1.6,0.4-2-0.7c-0.9-2.5-1.7-5-1.6-7.7c0.3-3.8,1.3-7.4,4.4-10.1c0.1-0.1,0.2-0.2,0.3-0.3c2.5-2.8,5.8-3.9,9.4-4.3	c0.5-0.1,1.1-0.1,1.7-0.1c2.1-2.3,3-4.9,2.4-8c0-0.2-0.1-0.5-0.2-0.7c-0.3-1,0-1.7,0.9-2.3c2.1-1.5,4.3-2.9,6.7-3.8	c1.6-0.6,3.2-1.1,4.8-1.6c1.4-0.4,2.8-0.5,4.3-0.5c4.6,0,8.9,1.1,12.9,3.3c2.5,1.4,4.7,3.1,6.4,5.4c0.1,0.1,0.2,0.3,0.3,0.4	c0.8,1,1,2,0.2,3.1c-0.7,0.9-0.7,1.9-0.4,2.9c0.3,1.2,0.8,2.4,1.8,3.2c1.1,0.1,2.2,0.2,3.2,0.4c3.4,0.5,6.3,2.2,8.5,4.7	c3.2,3.8,4.7,8.2,3.4,13.2c-0.2,1-0.6,1.9-1.1,2.8c-0.6,1.2-1.5,1.5-2.7,0.8c-1.5-0.9-2.8-2-4.2-3c-0.5-0.4-1-0.8-1.6-1.2	c-0.2,0.2-0.4,0.3-0.5,0.4C88,49.1,88,49.3,88,49.4c0.1,0.1,0.1,0.2,0.2,0.3c2,1.4,3.8,3.2,5.6,4.8c3.1,2.9,5.1,6.5,6.2,10.5	c0.9,3,1.2,6.1,1.4,9.2c0.2,2.7,0,5.4-0.5,8c-0.5,2.6-1.4,5.1-2.7,7.4c-1.7,3.1-3.7,5.9-6.1,8.4c-0.1,0.1-0.1,0.2-0.2,0.4	c1.1,1.8,1.7,3.8,2.4,5.9c1.2,3.4,0.4,6.5-1.6,9.4c-1,1.4-2.5,1.8-4.1,1.8c-1.8,0-3.5-0.6-5-1.7c-2-1.5-3.9-3-5.4-5	c-0.5-0.7-1.1-1.4-1.7-2.1c-0.8,0.2-1.5,0.3-2.1,0.5c-2.9,0.9-5.8,1.4-8.8,1.8c-3,0.4-6,0.7-9,0.4c-2.5-0.2-5-0.8-7.3-1.6	c-0.7-0.2-1.3-0.5-2.1-0.8c-0.3,0.2-0.6,0.4-0.8,0.6c-1,1-2.2,1.7-3.5,2.2c-1.7,0.7-3.4,1.4-5.2,2c-2.5,0.8-5.4-0.8-6.2-3.5	c-0.5-1.7-0.5-3.4-0.2-5.2c0.4-2.4,1.1-4.7,2.4-6.7c0.1-0.2,0.2-0.4,0.3-0.7c-0.3-0.5-0.6-1.1-0.9-1.7c-1.1-2-2.1-4.2-2.7-6.4	c-0.6-2.1-1.4-4.1-1.8-6.2c-0.5-2.9-1-5.8-0.9-8.7c0.1-3.2,0.7-6.3,1.9-9.3c0.5-1.2,1.3-2.3,1.9-3.4c0.2-0.4,0.5-0.6,0.8-1	c2-3.2,4.7-5.9,7.5-8.5C39.8,50.1,39.9,49.9,40.2,49.6z M59.1,107.1c1.7-0.2,3.3-0.4,5-0.5c3-0.2,5.8-1,8.5-2	c1.6-0.6,3.2-1.4,4.6-2.3c2.2-1.5,4.4-3.1,6.2-5.2c4.4-4.8,7.4-10.3,8.6-16.7c0.3-1.6,0.5-3.3,0.4-5c-0.1-2.8-0.4-5.6-1-8.4	c-0.5-2.2-1-4.4-2-6.5c-1.6-3.5-3.8-6.5-6.7-9c-2.8-2.3-5.7-4.3-9.1-5.8c-0.5-0.2-1.1-0.5-1.7-0.6c-2.8-0.5-5.6-1.1-8.5-1.4	c-1.8-0.1-3.7-0.3-5.6-0.1c-4.5,0.5-8.5,2.4-12.2,4.9c-2.9,2-5.5,4.3-7.9,6.8c-1.7,1.7-3.1,3.7-4.4,5.7c-1.5,2.4-2.2,5-2.9,7.7	c-0.1,0.4-0.1,0.8-0.2,1.2c-0.5,3.2,0,6.5,0.4,9.7c0.5,3.5,1.6,6.8,2.9,10c2.4,5.9,6.6,10.4,12.1,13.6	C49.8,105.8,54.3,107,59.1,107.1z M72.8,25.8c-1.5-1.9-2.1-2.4-4.3-3.5c-2.5-1.3-5.1-2.2-7.9-1.8c-0.9,0.1-1.9,0.4-2.8,0.6	c-1.9,0.3-3.2,1.5-4.6,2.7c0.1,0.8,0.3,1.5,0.4,2.2c0.1,0.6,0.1,1.3,0,2c-0.4,1.5-0.9,2.9-1.8,4.1c-0.2,0.3-0.4,0.6-0.7,1.1	c0.4,0.3,0.8,0.5,1,0.8c1.1,1.2,0.9,2.9-0.4,3.9c-1.7,1.2-3.5,2.4-5.2,3.5c-0.3,0.2-0.5,0.4-0.9,0.7c0.6,0.9,1.2,1.7,2,2.3	c1.5-0.6,2.9-1.3,4.4-1.8c1.4-0.5,2.9-0.8,4.3-1.1c1.5-0.3,3.1-0.4,4.6-0.6c0.1-1.2,0.1-2.3,0.2-3.5c0.1-1.2,0.3-2.3,0.3-3.5	c-0.1-0.1-0.2-0.2-0.2-0.2c-0.6-0.1-1.2-0.2-1.8-0.3c-1.1-0.2-1.6-0.6-1.8-1.7c-0.1-0.9-0.2-1.9-0.2-2.9c0-0.7,0.1-1.4,0.1-2.2	c0-1.3,0.4-1.8,1.7-1.8c2.5-0.1,5-0.1,7.5-0.1c1.1,0,1.8,0.6,1.9,1.7c0.1,0.4,0.1,0.8,0.1,1.3c-0.1,1.3-0.3,2.5-0.2,3.8	c0,1.5-0.7,2.4-2.5,2.3c-0.3,0-0.6-0.1-0.9,0c-0.3,0-0.7,0.1-1,0.2c-0.5,5.2-0.5,5.6,0.1,7c0.3,0,0.6,0.1,0.9,0.1	c3.2,0.3,6.3,1,9.2,2.2c1.8,0.7,3.6,1.2,5.5,1.8c0.5-0.6,0.8-1.1,1.3-1.7c-1.6-1.2-3.1-2.4-4.6-3.6c-1.1-0.9-2.2-1.7-3.2-2.6	c-0.6-0.6-0.6-1.3-0.1-1.9c0.3-0.3,0.6-0.6,0.9-0.8c0.3-0.3,0.6-0.5,1.1-0.8C72.3,31.6,72.1,28.9,72.8,25.8z M84.2,100.2	c0.5,0.2,0.8-0.1,1.1-0.3c2.1-1.3,3.9-2.9,5.7-4.7c1.9-1.9,3.3-4.2,4.7-6.6c1.9-3.2,2.8-6.7,3.1-10.4c0.3-4.5-0.2-8.9-1.5-13.2	c-0.7-2.4-1.7-4.7-3.4-6.7c-1.7-2-3.5-3.8-5.5-5.4c-0.2-0.1-0.3-0.4-0.7-0.1c0.3,0.4,0.6,0.9,0.9,1.3c3,3.8,4.6,8.2,5.6,12.9	c0.8,3.6,0.9,7.3,0.7,10.9c-0.1,1.4-0.2,2.8-0.5,4.1c-1.4,6.5-4.4,12.1-9,16.9C84.9,99.3,84.6,99.8,84.2,100.2z M49.7,35.5	c-1.1-1.2-2.2-2.1-3.7-2.6c-1.8-0.7-3.6-0.7-5.5-0.5c-4.5,0.5-8.4,4-9.6,7.4c-0.5,1.3-0.8,2.6-1,4c-0.2,1.8,0.2,3.6,1,5.4	c0.3-0.2,0.7-0.5,1-0.7c1.8-1.4,3.6-2.8,5.4-4.2c2.9-2.2,5.8-4.4,9-6.3C47.5,37.3,48.6,36.4,49.7,35.5z M76.1,36.3	c0.5,0.3,0.7,0.4,0.9,0.5c1.6,1.2,3.2,2.5,4.9,3.7c4,2.9,8.1,5.8,12.2,8.6c0.3,0.2,0.6,0.3,0.9,0.5c0.5-1.4,0.8-2.7,0.7-4	c-0.4-4.2-2-7.6-5.6-9.9c-0.3-0.2-0.6-0.4-0.9-0.6c-1.7-0.9-3.4-1.4-5.3-1.4C81.1,33.8,78.8,34.9,76.1,36.3z M89.9,100.3	c-1.8,1.1-3.4,2.2-5.1,3.1c-1.7,0.9-3.4,1.6-5.1,2.5c0,0.1,0,0.2,0,0.2c1.7,2.6,4,4.6,6.6,6.2c1,0.6,2.1,0.6,3.1,0.5	c0.5,0,0.9-0.3,1.2-0.8c1.3-1.9,1.8-3.9,1.2-6.1c-0.4-1.3-0.8-2.6-1.2-3.9C90.4,101.3,90.1,100.9,89.9,100.3z M78.8,23	c-0.3-0.4-0.4-0.7-0.6-1c-0.7-0.7-1.4-1.3-2.1-2c-1.8-1.5-3.9-2.4-6-3.3c-2.9-1.2-5.9-1.5-9-1.6c-0.4,0-0.8,0-1.3,0.1	c-2.8,0.6-5.5,1.5-8.2,2.7c-0.5,0.2-1,0.5-1.4,0.8c-0.5,0.3-1.1,0.4-1.5,1c0.9,0.7,1.7,1.4,2.6,2.1c0.7-0.6,1.3-1,1.9-1.5	c1-0.9,2-1.4,3.3-1.7c0.6-0.1,1.1-0.4,1.7-0.5c1.6-0.3,3.2-0.7,4.8-0.4c4.1,0.6,7.8,2.1,10.9,5.1c0.3,0.3,0.6,0.6,0.9,0.8	C76.2,23.5,77.4,23.2,78.8,23z M35.9,98.3c-0.2,0.3-0.4,0.4-0.5,0.6c-0.3,0.8-0.6,1.6-0.9,2.4c-0.5,1.7-0.9,3.5-0.6,5.3	c0.3,1.6,1.3,3.1,3.6,2.3c0.1,0,0.2-0.1,0.3-0.1c1.7-0.7,3.4-1.4,5.1-2.1c0.5-0.2,1-0.5,1.4-1.1c-1.5-1.2-3.1-2.2-4.5-3.4	C38.5,101,37.2,99.7,35.9,98.3z M48.6,30.9c1.8-1.4,2.5-3.2,2.2-5.2c-0.2-1.5-0.7-2.7-2.2-3.3c-0.2,1.4-0.3,2.7-0.7,3.9	c-0.4,1.3-1,2.5-1.6,3.8C47.1,30.3,47.8,30.6,48.6,30.9z M65.7,31c0.4-1.1,0.4-2.2,0.2-3.2c-1.6-0.4-4-0.4-5.7,0.1	c-0.4,1.6-0.4,1.6,0.2,3C62.1,31.1,63.9,31.1,65.7,31z M75.5,25.7c-0.2,1-0.3,2-0.2,3c0.1,1,0.5,1.7,1.3,2.3	c0.6,0.4,1.2,0.8,1.8,1.2c0.4-0.2,0.9-0.4,1.3-0.6c-1.1-2-1.6-4-1.5-6.2C77.2,25.1,76.3,25.4,75.5,25.7z M40.5,45.6	c0.7,0.9,1.3,1.7,2,2.4c0.9-0.7,1.8-1.3,2.6-2c-0.5-0.8-1.1-1.6-1.8-2.4C42.3,44.2,41.4,44.9,40.5,45.6z M86.1,47	c-0.9-0.6-1.8-1.3-2.7-2c-0.3,0.5-0.5,0.9-0.8,1.3c1,0.6,2,1.1,2.9,1.5c0.2-0.2,0.4-0.3,0.5-0.4C86,47.3,86,47.2,86.1,47z M35.5,25.4c-0.2-1-0.4-2-0.5-3c-0.3-2.1-0.6-4.1-0.9-6.2c-0.1-0.5-0.2-0.9-0.4-1.4c-0.3-0.5-0.7-0.8-1.3-0.7	c-0.6,0.1-1.1,0.5-1.2,1.1c0,0.2,0,0.5,0,0.7c0.2,0.9,0.3,1.9,0.5,2.8c0.6,2.9,1.4,5.8,2.3,8.6c0.1,0.4,0.3,0.8,0.5,1.1	c0.1,0.2,0.4,0.2,0.6,0.2c0.1,0,0.3-0.2,0.4-0.3c0.1-0.4,0.2-0.8,0.2-1.2C35.6,26.6,35.6,26,35.5,25.4z M97.6,27.4	c2.2-2.9,4.3-5.9,6.5-8.8c0.2-0.3,0.4-0.7,0.5-1.1c0.1-0.6-0.3-1.2-0.8-1.5c-0.5-0.2-1.1-0.2-1.5,0.3c-0.3,0.2-0.5,0.6-0.7,0.8	c-2.2,3-3.9,6.3-5.5,9.7c-0.3,0.6-0.5,1.2-0.4,2.1C96.7,28.5,97.2,28,97.6,27.4z M101.7,32.4c3.1-1.2,6.1-2.4,9.2-3.6	c0.3-0.1,0.7-0.2,1-0.4c0.6-0.4,0.8-1.1,0.5-1.7c-0.2-0.6-0.8-1-1.4-0.9c-0.5,0.1-0.9,0.2-1.4,0.4c-3.6,1.3-6.9,3.3-9.9,5.6	c-0.2,0.2-0.4,0.4-0.7,0.8C100.2,33,100.9,32.7,101.7,32.4z M29.9,30.7c-0.2-0.6-0.5-1.2-0.8-1.8c-0.9-1.6-1.8-3.3-2.8-4.8	c-0.6-0.9-1.3-1.7-2-2.5c-0.4-0.5-1.1-0.5-1.7-0.3c-0.5,0.2-0.9,0.9-0.7,1.5c0.1,0.4,0.3,0.9,0.6,1.2c0.8,0.9,1.5,1.8,2.4,2.7	c1.3,1.4,2.7,2.9,4.1,4.3c0.2,0.2,0.5,0.3,0.9,0.5C29.9,31.2,30,30.9,29.9,30.7z M26,35.7c-0.3-0.3-0.7-0.7-1.1-0.9	c-2.2-1.1-4.4-2.1-6.6-3.2c-0.3-0.1-0.6-0.2-0.8-0.3c-0.8-0.1-1.5,0.2-1.7,0.9c-0.2,0.6,0.1,1.3,0.7,1.7c0.2,0.1,0.4,0.2,0.7,0.3	c2.4,1,4.8,1.7,7.3,2.4c0.6,0.1,1.2,0.2,2-0.1C26.3,36.2,26.2,35.8,26,35.7z M91.5,25.6c0.4-1.7,0.7-3.4,1-5.1	c0.1-0.4,0.1-0.8,0-1.2c-0.1-0.7-0.8-1.2-1.4-1.1c-0.6,0-1.1,0.5-1.3,1.1c-0.1,0.4-0.2,0.8-0.2,1.2c0,2.1,0.1,4.2,0.2,6.2	c0,0.3,0.3,0.6,0.5,1C91.3,27.2,91.3,26.3,91.5,25.6z M87.6,76.8c0,3.4-0.4,6.5-1.4,9.4c-0.7,2.1-1.7,4-3.1,5.7	c-1.3,1.6-2.9,2.9-4.5,4.2c-3.2,2.6-6.9,4.3-10.7,5.8c-0.8,0.3-1.6,0.5-2.4,0.6c-2.4,0.2-4.8,0.3-7.2-0.2c-1.1-0.2-2.2-0.3-3.4-0.6	c-2.6-0.5-4.9-1.8-7-3.4c-2.6-2-4.7-4.4-6.8-6.9c-2.9-3.5-4.7-7.5-5.6-11.9c-0.4-2-0.3-3.9-0.1-5.9c0.4-3.7,1.4-7.3,3-10.7	c1.6-3.4,3.9-6.3,6.9-8.7c2.4-1.9,5.1-3.4,7.9-4.6c3.1-1.3,6.4-1.7,9.7-1.6c1.9,0,3.7,0.5,5.5,1c3.1,0.9,5.9,2.3,8.6,4.1	c1.7,1.1,3.2,2.5,4.5,4.1c1.1,1.4,1.9,3,2.6,4.7c0.6,1.4,1.2,2.8,1.7,4.1c1.3,3,1.9,6.2,1.9,9.5C87.6,76.1,87.6,76.6,87.6,76.8z M85.1,75.1c0-1.6-0.4-4.4-1.5-7.1c-0.7-1.7-1.4-3.4-2.1-5.1c-1.4-3.4-3.7-6-6.8-7.9c-2.4-1.5-4.8-2.6-7.5-3.4	c-2.8-0.9-5.5-1-8.4-0.7c-2.1,0.2-4.2,0.9-6.2,1.8c-1.5,0.7-2.9,1.7-4.3,2.6c-3.2,2.1-5.6,4.9-7.3,8.3c-1.8,3.6-2.8,7.4-3.1,11.4	c-0.2,2.6,0.1,5.2,1.1,7.6c1.1,2.8,2.6,5.5,4.6,7.9c2.1,2.5,4.5,4.7,7.1,6.6c0.7,0.5,1.5,0.9,2.3,1.3c2.4,1.1,5,1.6,7.7,1.7	c2.8,0.1,5.5,0,8-1.4c0.3-0.2,0.7-0.3,1-0.4c3.4-1.4,6.3-3.4,9.1-5.7c2.5-2.1,4.1-4.8,5.1-7.9C84.8,81.9,85,79.2,85.1,75.1z M31.8,44.4c0.1,0.4,0.4,0.6,0.8,0.6c0.4,0,0.9-0.2,1-0.6c0.1-0.3,0.1-0.7,0.2-1.1c0.3-1.7,0.8-3.4,1.9-4.8c0.1-0.2,0.3-0.4,0.3-0.6	c0-0.2,0-0.5-0.1-0.6c-0.1-0.1-0.5-0.3-0.6-0.2c-0.4,0.1-0.8,0.3-1.1,0.6c-1.6,1.6-2.1,3.7-2.4,5.8C31.7,43.8,31.7,44.1,31.8,44.4z M81.1,35.5c-0.3,0.1-0.6,0.2-0.7,0.5c-0.2,0.2-0.3,0.5-0.2,0.8c0,0.4,0.4,0.7,0.7,0.6c0.4,0,0.8-0.1,1.2-0.2c1.7-0.4,3.4-0.5,5,0.4	c0.2,0.1,0.4,0.2,0.7,0.3c0.3,0.1,0.6,0.1,0.8-0.2c0.1-0.2,0-0.5-0.1-0.7c-0.1-0.2-0.3-0.4-0.5-0.5c-1.1-1.1-2.5-1.4-4.4-1.5	C83,35.1,82,35.3,81.1,35.5z M58.1,77.1c-0.1-0.4-0.2-0.7-0.3-1c-0.7-2.4,0.7-5.6,4.4-5.9c1.5-0.1,2.7,0.3,3.8,1.4	c0.5,0.6,1,1.2,1.7,1.9c0.5,0,1.1,0.1,1.8,0.1c1.6,0.1,3.2,0.2,4.8,0.3c0.9,0.1,1.3,0.6,1.2,1.2c-0.1,0.6-0.6,0.8-1.4,0.8	c-1.6-0.1-3.1-0.2-4.7-0.3c-0.7,0-1.3-0.1-2-0.2c-0.6,0.8-0.8,1.9-1.6,2.5c-0.9,0.7-1.8,1.1-2.9,1.3c-1.1,0.2-2-0.2-3-0.7	c-0.3,0.3-0.6,0.5-0.8,0.8c-0.8,0.9-1.6,1.8-2.4,2.7c-0.9,1.1-1.7,2.1-2.6,3.2c-1.3,1.6-2.7,3.2-4,4.8c-0.3,0.3-0.6,0.6-1,0.8	c-0.2,0.1-0.5,0.1-0.6-0.1c-0.2-0.1-0.3-0.4-0.3-0.6c0.1-0.4,0.3-0.8,0.5-1.1c2.7-3.1,4.7-6.8,7.7-9.7	C56.8,78.7,57.4,77.9,58.1,77.1z M62.5,76.4c0.8-0.1,1.6-0.4,2-1.4c0.2-0.5,0.2-0.9-0.2-1.3c-0.8-0.8-1.7-1.1-2.8-0.7	c-0.3,0.1-0.6,0.3-0.8,0.6c-0.4,0.6-0.5,1.2-0.1,1.8C60.9,76.1,61.5,76.4,62.5,76.4z M59.2,93.2c0.5-0.2,0.8-0.4,1.1-0.4	c0.3-0.1,0.7-0.2,1-0.2c1.9,0,2.9,1.5,2.2,3.3c-0.8,2.1-2.8,2.5-4.6,2c-2.1-0.7-2.6-1.7-2.1-3.8c0.4-1.8,1.3-3.3,2.2-4.8	c0.1-0.2,0.3-0.4,0.5-0.5c0.1-0.1,0.3-0.1,0.3,0c0.1,0.1,0.3,0.3,0.3,0.4c-0.1,0.6-0.2,1.3-0.4,1.9C59.7,91.6,59.2,92.3,59.2,93.2z M59.7,96c0.7,0.2,1.3,0.1,1.7-0.4c0.2-0.2,0.2-0.6,0.2-0.8c-0.1-0.3-0.5-0.3-0.8-0.1C60.3,95,59.9,95.3,59.7,96z M80.2,75.1	c-0.4,0.2-0.8,0.3-1.1,0.5c-0.4,0.2-0.6,0.6-0.5,1.1c0.1,0.4,0.4,0.7,0.9,0.7c0.5,0,1,0.1,1.5,0.1c0.2,0.7-0.1,1.1-0.6,1.2	c-0.5,0.1-1.1,0.2-1.6,0.3c-0.6,0.1-1,0.6-0.9,1.1c0,0.4,0.5,0.9,1,0.8c0.8-0.1,1.7-0.1,2.5-0.4c1.6-0.6,2.2-2.2,1.5-3.8	c-0.1-0.2-0.2-0.4-0.4-0.7c0.2-0.4,0.5-0.8,0.7-1.3c0.6-1.3,0-2.6-1.3-3c-1.1-0.4-2.1-0.4-3.2,0c-0.2,0.1-0.5,0.2-0.6,0.4	c-0.2,0.2-0.3,0.6-0.2,0.8c0.1,0.2,0.4,0.5,0.6,0.6c0.3,0.1,0.7,0,1.1-0.1c0.7-0.1,1.3-0.1,1.9,0.4C81.3,74.4,80.8,74.8,80.2,75.1z M43.4,74.7c-0.5-0.1-1-0.1-1.5-0.3c-1.5-0.4-2.2-1.8-1.6-3.3c0.2-0.6,0.6-1.2,1.1-1.6c1-1,2.9-0.9,3.9,0c0.2,0.2,0.3,0.6,0.3,1	c-0.1,1.1-0.2,2.1-0.3,3.2c-0.2,1.5-0.4,3-0.7,4.4c0,0.1,0,0.3-0.1,0.3C44.5,78.7,44.2,79,44,79c-0.2,0-0.6-0.2-0.7-0.4	c-0.2-0.4-0.2-0.8-0.2-1.2C43.2,76.5,43.3,75.6,43.4,74.7z M43.9,70.5c-0.5-0.2-0.9-0.1-1.2,0.2c-0.3,0.3-0.5,0.8-0.7,1.2	c-0.1,0.3,0.3,0.8,0.7,0.8c0.5,0,0.8-0.2,1-0.6C44,71.7,44.1,71.2,43.9,70.5z M66.6,56.4c0.2-0.3,0.5-0.7,0.7-1	c0.6-1.2,0.3-2.1-1-2.6c-1.1-0.4-2.1-0.1-3.1,0.4c-0.3,0.2-0.6,0.5-0.4,0.9c0.1,0.4,0.4,0.6,0.8,0.6c0.5,0,1-0.1,1.8-0.2	c-0.5,0.6-0.8,1.1-1.1,1.5c-0.4,0.6-0.9,1.2-1.3,1.9c-0.5,0.9,0,1.7,1,1.8c1.6,0,3.1,0,4.7,0c0.6,0,1.1-0.5,1.1-1c0-0.5-0.4-1-1-1.1	c-0.4,0-0.7,0-1.1,0c-0.5,0-1-0.1-1.9-0.1C66.2,57,66.4,56.7,66.6,56.4z M60.5,56.6c0-0.9,0-1.8,0-2.7c0-0.8-0.3-1.2-0.7-1.3	c-0.4-0.1-0.9,0.3-0.9,1.1c-0.1,1.7-0.1,3.5-0.1,5.2c0,0.3,0.2,0.7,0.4,0.9c0.3,0.4,1.2,0.3,1.3-0.2c0.1-0.3,0.1-0.6,0.1-0.9	C60.7,58.1,60.6,57.3,60.5,56.6C60.6,56.6,60.5,56.6,60.5,56.6z"/>
<!--coffee cup-->
<path class="coffee-cup" filter="url(#shadow)" d="M151.1,124.5c-0.8,1.4-1.5,2.7-2.2,4.1c-0.7,1.4-1.8,2.4-3.2,3c-3.3,1.5-6.7,2.5-10.4,1.9c-0.9-0.2-1.9-0.3-2.9-0.3	c-2.4-0.2-4.7-1-7-1.7c-1.6-0.5-2.8-1.6-4.1-2.6c-0.5-0.4-0.7-0.9-1.1-1.4c-0.7-1-1.3-2-2-3c-1-1.5-1.7-3.2-2.3-4.8	c-1.9-5.1-3.2-10.3-4.1-15.6c-0.3-1.5-0.4-3-0.4-4.5c0-2.3,1.2-4.1,3.1-5.4c1.1-0.7,2.3-1.4,3.5-1.9c2.4-1,4.9-1.6,7.5-1.8	c1.8-0.2,3.7-0.4,5.5-0.5c2.5-0.2,5,0,7.5,0.5c1.1,0.2,2.3,0.3,3.4,0.4c2.5,0.3,5,0.7,7.4,1.5c2.4,0.8,4.6,1.9,6.8,3.3	c2.2,1.4,2.9,3.6,2.8,6c0,0.5-0.1,1-0.2,1.7c0.9-0.1,1.6-0.1,2.4-0.3c2.7-0.4,5.1,0.4,7.2,2c0.2,0.1,0.4,0.3,0.6,0.5	c2.3,1.8,2.9,4.2,2.3,7.1c-0.6,2.7-2.2,4.9-4.2,6.8c-1.5,1.3-3.1,2.4-5,3c-1.3,0.4-2.6,1-3.9,1.3c-1.7,0.5-3.4,0.8-5.1,0.7	C152.3,124.5,151.8,124.5,151.1,124.5z M114.8,106c0.1,0.6,0.1,0.9,0.2,1.2c0.8,3.7,1.9,7.4,3.3,11c0.6,1.6,1.1,3.2,2.1,4.6	c1.1,1.6,2.3,3.2,3.7,4.6c0.8,0.8,1.6,1.4,2.7,1.7c1.8,0.5,3.6,1,5.4,1.4c0.9,0.2,1.8,0.1,2.7,0.3c2.5,0.5,5,0.2,7.4-0.6	c2.8-0.9,3.4-1.3,4.8-3.9c1.5-2.8,2.9-5.6,4.3-8.5c1.3-2.7,2.3-5.5,3.1-8.4c0.1-0.3,0.1-0.7,0.1-1.2c-0.5,0.3-0.9,0.5-1.3,0.7	c-1.5,0.9-3.2,1.5-4.9,1.8c-1.7,0.4-3.4,0.6-5.1,0.8c-3,0.4-6,0.3-9,0.5c-3.7,0.2-7.3-0.7-10.7-1.8	C120.5,109.2,117.7,107.9,114.8,106z M151.6,101.7c0.8-0.4,1.3-1,1.8-1.6c0.9-1.2,0.6-2.7-0.9-3.4c-2.4-1.1-4.8-2.2-7.4-2.6	c-2.6-0.4-5.2-0.7-7.9-0.9c-2.8-0.2-5.5-0.1-8.3,0.2c-1.1,0.1-2.2,0.3-3.2,0.1c-1.9-0.3-3.6,0.2-5.3,0.8c-0.4,0.1-0.9,0.4-1.2,0.7	c-0.7,0.8-1.1,1.7-0.9,2.8c0.2,1.1,0.5,2.1,1.6,2.7c1.8-1.4,4-1.9,6.1-2.5c2.9-0.8,5.8-1.3,8.9-1.2c1.1,0,2.2,0.2,3.2,0.3	c4.7,0.6,9.3,1.8,13.3,4.5C151.4,101.7,151.5,101.7,151.6,101.7z M155.8,99.7c-0.5,0.8-0.9,1.5-1.4,2.1c-1.9,2.2-4.6,3.2-7.4,3.8	c-1.5,0.3-3.1,0.4-4.6,0.4c-2.3,0.1-4.7,0-7,0c-1.2,0-2.4-0.2-3.6-0.2c-2.2,0-4.3-0.3-6.4-0.8c-2.2-0.5-4.4-1.3-6.2-2.7	c-1.6-1.1-2.6-2.6-2.5-4.7c0-0.4,0-0.8,0-1.2c-0.2,0-0.4-0.1-0.4,0c-1,0.5-1.6,1.5-2,2.5c-0.1,0.4-0.1,0.8,0,1.2	c0.6,2.2,1.9,3.9,3.9,4.9c1.4,0.6,2.7,1.2,4.1,1.9c2.1,1,4.4,1.4,6.7,2c1.1,0.3,2.4,0.4,3.6,0.5c4.1,0.1,8.1-0.2,12.2-0.7	c2.9-0.4,5.7-1.1,8.3-2.7c1.5-1,2.5-2.2,3.1-3.8C156.4,101.3,156.4,100.6,155.8,99.7z M152.7,121.7c0.7,0.3,1.4,0.2,2.1,0.1	c2.1-0.3,4-1,6-1.7c1.5-0.6,2.9-1.4,4.2-2.4c1.8-1.6,3.1-3.4,3.7-5.8c0.3-1.3,0.1-2.5-0.7-3.4c-1.2-1.4-2.8-2.5-4.7-2.7	c-1.8-0.2-3.6,0-5.2,0.6c-0.5,1.4-0.5,1.4-0.5,2.3c0.5-0.1,0.9-0.2,1.4-0.2c3.5,0,4.8,3,4,5.2c-0.7,1.9-1.9,3.5-3.9,4.2	c-1.5,0.6-3,1.2-4.7,1.2c-0.3,0-0.6,0.2-0.9,0.2C153.2,120.1,152.7,120.8,152.7,121.7z M149.5,102.8c-0.6-0.7-1.2-1-1.9-1.3	c-1-0.4-2-0.7-3-1.1c-3.1-1.1-6.3-1.6-9.5-1.8c-2.6-0.2-5.1,0.3-7.7,0.9c-1.5,0.3-2.9,0.8-4.3,1.2c-0.6,0.2-1.2,0.4-1.7,1	c2.3,1.3,4.7,1.8,7.2,2.2c0-1.3,0.1-1.4,0.9-1.9c0.8-0.6,1.7-1.1,2.6-1.6c0.4-0.2,0.8-0.4,1.1-0.5c0.1,0,0.4,0,0.5,0.1	c0.2,0.2,0.2,0.5,0,0.6c-0.5,0.5-0.9,0.9-1.5,1.3c-0.8,0.6-1.7,1.2-2.8,2c0.5,0.1,0.8,0.2,1.1,0.2c1.9,0.1,3.7,0.3,5.6,0.3	c3.5,0.1,6.9,0.1,10.4-0.4C147.6,103.8,148.5,103.4,149.5,102.8z M154.9,116.1c1.1,0.2,1.8-0.3,2.6-0.5c1.5-0.3,2.3-1.4,3-2.6	c0.3-0.6,0.1-1.5-0.5-1.9c-0.8-0.5-2.8-0.2-3.4,0.5c-0.1,0.2-0.2,0.4-0.3,0.6C155.8,113.5,155.4,114.7,154.9,116.1z M134.2,128.5	c3.1,0.2,6-0.6,8.8-2c0.5-0.2,0.9-0.6,1.2-1c0.1-0.2,0.1-0.6,0-0.8c-0.1-0.2-0.5-0.3-0.8-0.3c-0.3,0-0.5,0.2-0.8,0.4	c-1.2,0.7-2.4,1.2-3.7,1.7c-1.5,0.5-3.1,0.7-4.7,1c-0.4,0.1-0.9,0-1,0.5C133.4,128.4,133.8,128.4,134.2,128.5z M148.9,115	c-1,2-1.9,4.1-2.9,6.1c0,0.1-0.1,0.2-0.1,0.3c0.1,0.3,0.1,0.6,0.3,0.7c0.2,0.1,0.6,0.1,0.8-0.1c0.3-0.3,0.7-0.7,0.8-1.1	c0.7-1.7,1.3-3.4,1.9-5.2c0.1-0.4,0.3-0.9-0.1-1.3C149.2,114.3,149,114.7,148.9,115z M137.2,100.2c-1.3,0.7-2.6,1.5-3.9,2.2	c-0.1,0.1-0.2,0.1-0.3,0.2c-0.1,0.2-0.2,0.5-0.1,0.7c0.1,0.2,0.3,0.3,0.5,0.4c0.3,0,0.6-0.1,0.9-0.2c1.1-0.5,2.1-1.1,3-1.9	c0.2-0.2,0.4-0.4,0.5-0.7c0.1-0.2,0-0.5-0.1-0.8C137.5,100.1,137.3,100.1,137.2,100.2z M140.9,100.9c-1.1,0.3-2,1-2.8,1.8	c-0.3,0.3-0.3,0.8,0,1c0.2,0.1,0.6,0.2,0.8,0.1c0.9-0.6,1.7-1.3,2.5-2c0.1-0.1,0.1-0.3,0.2-0.6C141.3,101.1,141.1,100.8,140.9,100.9	z M126.1,101.7c0,0-0.1,0.1-0.1,0.2c0,0.2,0,0.5,0.2,0.6c0.1,0.1,0.5,0.3,0.6,0.2c1-0.5,2-1.1,2.7-2c0.1-0.1,0.1-0.2,0-0.3	c-0.1-0.1-0.2-0.2-0.4-0.4C128,100.4,126.9,100.8,126.1,101.7z M145,102.1c0.1-0.3-0.4-0.7-0.7-0.6c-0.7,0.2-1.3,0.6-1.6,1.3	c-0.2,0.3,0.1,0.8,0.5,0.8C143.9,103.6,144.9,102.8,145,102.1z"/>
<!--coffee steam swirls-->
<g class="coffee-swirl">
<path class="steam1" d="M142,86.6c-0.4-4.1,2.4-5.7,3.8-9c0.9-2.2,0.5-4.9-0.3-7.1c-0.2-0.5-1-0.3-0.8,0.2	c1.2,4.4-1.8,6.4-3.5,9.9c-1,1.9-0.8,4-0.3,6C141.1,87.3,142,87.2,142,86.6L142,86.6z" fill="#FFFFFF"/>
<path class="steam2" d="M132,85.8c1.1-4.5,1.9-9.9-2.3-13.2c-2.4-1.9-8.1-1.9-7.8,2.4c0.1,1.1,1.6,1.7,2.2,0.6	c1.6-3,4.7-0.8,5.9,1.3c1.4,2.7,1.1,5.8,0.9,8.7C130.7,86.3,131.8,86.5,132,85.8L132,85.8z" fill="#FFFFFF"/>
<path class="steam3" d="M138.6,86.1c-2.8-1.5-0.5-10.4-0.2-12.6c0.3-2.3,0.4-4.6-0.2-6.9c-0.9-3.3-3.3-6.7-7-6.7	c-1.3,0-1.6,1.6-0.6,2.4c3.4,2.4,4.9,4.6,4.9,9c0,3.1-0.7,6.1-0.6,9.2c0.1,2.3,0.6,6.2,3.3,6.7C138.8,87.3,139.2,86.4,138.6,86.1	L138.6,86.1z" fill="#FFFFFF"/>
</g>
</svg> </div>
</div> <script src="js/index.js"></script>
</body>
</html>

Alarm animation with white drop shadow - Script Codes CSS Codes

body { width: 100%; height: 100vh; background: linear-gradient(30deg, #06a7e2, #54cefa);
}
svg { position: absolute; top: 40%; left: 40%;
}
svg path.shadow { -webkit-box-shadow: 10px 10px 5px 0px white; -moz-box-shadow: 10px 10px 5px 0px white; box-shadow: 10px 10px 5px 0px white;
}
.alarm { transform-origin: center center;
}
svg .alarm { animation-name: wiggle; animation-duration: 2s; animation-delay: 3s; animation-iteration-count: 3; animation-timing-function: linear;
}
/*alarm wiggle*/
@keyframes wiggle { 5%, 15%, 25%, 35%, 45% { transform: rotate(-10deg); } 0%, 10%, 20%, 30%, 40% { transform: rotate(10deg); } 50%, 100% { transform: rotate(0deg); }
}
/*coffee steam*/
.steam1 { -webkit-animation: steaming 7s linear infinite; -moz-animation: steaming 7s linear infinite; animation: steaming 7s linear infinite;
}
.steam2 { -webkit-animation: steaming 5s linear infinite; -moz-animation: steaming 5s linear infinite; animation: steaming 5s linear infinite;
}
.steam3 { -webkit-animation: steaming 9s linear infinite; -moz-animation: steaming 9s linear infinite; animation: steaming 9s linear infinite;
}
@-webkit-keyframes steaming { 0% { transform: translateY(0px); opacity: 0; } 50% { opacity: 1; } 100% { transform: translateY(-10px); opacity: 0; }
}
@keyframes steaming { 0% { opacity: 0; } 50% { opacity: 1; } 100% { transform: translateY(-10px); opacity: 0; }
}
@-moz-keyframes steaming { 0% { transform: translateY(0px); opacity: 0; } 50% { opacity: 1; } 100% { transform: translateY(-10px); opacity: 0; }
}

Alarm animation with white drop shadow - Script Codes JS Codes

//Wake up!
Alarm animation with white drop shadow - Script Codes
Alarm animation with white drop shadow - Script Codes
Home Page Home
Developer Ann Kwilinski
Username ann_kwilinski
Uploaded July 25, 2022
Rating 3
Size 9,164 Kb
Views 58,696
Do you need developer help for Alarm animation with white drop shadow?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Ann Kwilinski (ann_kwilinski) Script Codes
Name
Quiz UI
Pancakes n stars
US map
Brown Smoke
A Pen by Ann Kwilinski
Gradient
Pancakes Blink
Clock arm animation
Pancakes Float
Alarm animation
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!