Hover the icon or press Play. Suggested motion: ring. Pick another to preview it and update the animated code:
Alarm Clock icon
A free alarm clock icon from Themify Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.
Also known asbell iconnotification iconalert iconreminder icontime iconwatch iconhistory icontimer icon
- License
- MIT license
- Project
- github.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/themify/alarm-clock.jsonimport * as React from "react";
/**
* Alarm Clock from Themify Icons (https://github.com/lykmapipo/themify-icons), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/themify/alarm-clock. Sized in em, colored by currentColor.
*/
export function TfiAlarmClockIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
version="1.1"
viewBox="0 0 17 17"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<g />
<path
d="M14.714 6.791c0.504-0.512 0.786-1.181 0.786-1.903 0-1.503-1.223-2.726-2.725-2.726-0.886 0-1.695 0.434-2.207 1.15-0.501-0.155-1.026-0.249-1.568-0.287v-1.025h1v-1h-3v1h1v1.025c-0.542 0.038-1.067 0.132-1.568 0.287-0.512-0.717-1.32-1.15-2.207-1.15-1.502 0-2.725 1.223-2.725 2.726 0 0.723 0.282 1.392 0.786 1.903-0.499 0.962-0.786 2.052-0.786 3.209 0 1.707 0.616 3.271 1.635 4.487l-1.285 1.713 0.8 0.6 1.192-1.59c1.239 1.109 2.868 1.79 4.658 1.79s3.419-0.681 4.658-1.79l1.192 1.59 0.8-0.6-1.285-1.713c1.019-1.216 1.635-2.78 1.635-4.487 0-1.157-0.287-2.247-0.786-3.209zM12.775 3.162c0.951 0 1.725 0.774 1.725 1.726 0 0.373-0.12 0.724-0.335 1.017-0.678-0.936-1.581-1.694-2.63-2.202 0.322-0.339 0.762-0.541 1.24-0.541zM2.5 4.888c0-0.951 0.774-1.726 1.725-1.726 0.478 0 0.918 0.202 1.24 0.54-1.049 0.508-1.951 1.267-2.63 2.202-0.215-0.293-0.335-0.643-0.335-1.016zM8.5 16c-3.309 0-6-2.691-6-6s2.691-6 6-6 6 2.691 6 6-2.691 6-6 6zM9 10h4v1h-5v-4h1v3z"
/>
</svg>
);
}import { TfiAlarmClock } from "react-icons/tfi";
export function Example() {
return <TfiAlarmClock className="size-5" />;
}<svg
version="1.1"
viewBox="0 0 17 17"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<g />
<path
d="M14.714 6.791c0.504-0.512 0.786-1.181 0.786-1.903 0-1.503-1.223-2.726-2.725-2.726-0.886 0-1.695 0.434-2.207 1.15-0.501-0.155-1.026-0.249-1.568-0.287v-1.025h1v-1h-3v1h1v1.025c-0.542 0.038-1.067 0.132-1.568 0.287-0.512-0.717-1.32-1.15-2.207-1.15-1.502 0-2.725 1.223-2.725 2.726 0 0.723 0.282 1.392 0.786 1.903-0.499 0.962-0.786 2.052-0.786 3.209 0 1.707 0.616 3.271 1.635 4.487l-1.285 1.713 0.8 0.6 1.192-1.59c1.239 1.109 2.868 1.79 4.658 1.79s3.419-0.681 4.658-1.79l1.192 1.59 0.8-0.6-1.285-1.713c1.019-1.216 1.635-2.78 1.635-4.487 0-1.157-0.287-2.247-0.786-3.209zM12.775 3.162c0.951 0 1.725 0.774 1.725 1.726 0 0.373-0.12 0.724-0.335 1.017-0.678-0.936-1.581-1.694-2.63-2.202 0.322-0.339 0.762-0.541 1.24-0.541zM2.5 4.888c0-0.951 0.774-1.726 1.725-1.726 0.478 0 0.918 0.202 1.24 0.54-1.049 0.508-1.951 1.267-2.63 2.202-0.215-0.293-0.335-0.643-0.335-1.016zM8.5 16c-3.309 0-6-2.691-6-6s2.691-6 6-6 6 2.691 6 6-2.691 6-6 6zM9 10h4v1h-5v-4h1v3z"
/>
</svg>"Alarm Clock" icon from Themify Icons (https://github.com/lykmapipo/themify-icons), licensed under MIT license.