ios time icon

ios-time-outline from IonIcons by Ben Sperry · Outline · MIT Free for personal and commercial use.

Name
ios-time-outline
Set
IonIcons
Style
Outline
Viewbox
512×512
License
MIT

1 other variant in IonIcons

Related icons in IonIcons

Use the ios time icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M256 32C132.3 32 32 132.3 32 256s100.3 224 224 224 224-100.3 224-224S379.7 32 256 32zm147.1 371.1c-19.1 19.1-41.4 34.1-66.1 44.6-25.6 10.8-52.9 16.3-81 16.3s-55.3-5.5-81-16.3c-24.8-10.5-47-25.5-66.1-44.6C89.8 384 74.8 361.7 64.3 337 53.5 311.3 48 284.1 48 256s5.5-55.3 16.3-81c10.5-24.8 25.5-47 44.6-66.1C128 89.8 150.3 74.8 175 64.3 200.7 53.5 227.9 48 256 48s55.3 5.5 81 16.3c24.8 10.5 47 25.5 66.1 44.6 19.1 19.1 34.1 41.4 44.6 66.1 10.8 25.6 16.3 52.9 16.3 81s-5.5 55.3-16.3 81c-10.5 24.7-25.5 47-44.6 66.1z" fill="currentColor"/><circle cx="256" cy="80" r="8" fill="currentColor"/><circle cx="256" cy="432" r="8" fill="currentColor"/><circle cx="432" cy="256" r="8" fill="currentColor"/><circle cx="80" cy="256" r="8" fill="currentColor"/><circle cx="168" cy="103.6" r="8" fill="currentColor"/><circle cx="344" cy="408.4" r="8" fill="currentColor"/><circle cx="408.4" cy="168" r="8" fill="currentColor"/><circle cx="103.6" cy="344" r="8" fill="currentColor"/><circle cx="103.6" cy="168" r="8" fill="currentColor"/><circle cx="408.4" cy="344" r="8" fill="currentColor"/><circle cx="344" cy="103.6" r="8" fill="currentColor"/><circle cx="168" cy="408.4" r="8" fill="currentColor"/><path d="M269.9 248c-2.9-5-8.1-7.8-13.4-8l-38-63.4c-2.3-3.8-7.2-5-11-2.7s-5 7.2-2.7 11l37.6 62.9c-2.9 4.8-3.2 11.1-.2 16.3 1.5 2.5 3.5 4.5 5.9 5.8V392c0 4.4 3.6 8 8 8s8-3.6 8-8V269.9c7.6-4.5 10.2-14.2 5.8-21.9z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function IonIosTimeOutline(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M256 32C132.3 32 32 132.3 32 256s100.3 224 224 224 224-100.3 224-224S379.7 32 256 32zm147.1 371.1c-19.1 19.1-41.4 34.1-66.1 44.6-25.6 10.8-52.9 16.3-81 16.3s-55.3-5.5-81-16.3c-24.8-10.5-47-25.5-66.1-44.6C89.8 384 74.8 361.7 64.3 337 53.5 311.3 48 284.1 48 256s5.5-55.3 16.3-81c10.5-24.8 25.5-47 44.6-66.1C128 89.8 150.3 74.8 175 64.3 200.7 53.5 227.9 48 256 48s55.3 5.5 81 16.3c24.8 10.5 47 25.5 66.1 44.6 19.1 19.1 34.1 41.4 44.6 66.1 10.8 25.6 16.3 52.9 16.3 81s-5.5 55.3-16.3 81c-10.5 24.7-25.5 47-44.6 66.1z" fill="currentColor"/><circle cx="256" cy="80" r="8" fill="currentColor"/><circle cx="256" cy="432" r="8" fill="currentColor"/><circle cx="432" cy="256" r="8" fill="currentColor"/><circle cx="80" cy="256" r="8" fill="currentColor"/><circle cx="168" cy="103.6" r="8" fill="currentColor"/><circle cx="344" cy="408.4" r="8" fill="currentColor"/><circle cx="408.4" cy="168" r="8" fill="currentColor"/><circle cx="103.6" cy="344" r="8" fill="currentColor"/><circle cx="103.6" cy="168" r="8" fill="currentColor"/><circle cx="408.4" cy="344" r="8" fill="currentColor"/><circle cx="344" cy="103.6" r="8" fill="currentColor"/><circle cx="168" cy="408.4" r="8" fill="currentColor"/><path d="M269.9 248c-2.9-5-8.1-7.8-13.4-8l-38-63.4c-2.3-3.8-7.2-5-11-2.7s-5 7.2-2.7 11l37.6 62.9c-2.9 4.8-3.2 11.1-.2 16.3 1.5 2.5 3.5 4.5 5.9 5.8V392c0 4.4 3.6 8 8 8s8-3.6 8-8V269.9c7.6-4.5 10.2-14.2 5.8-21.9z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M256 32C132.3 32 32 132.3 32 256s100.3 224 224 224 224-100.3 224-224S379.7 32 256 32zm147.1 371.1c-19.1 19.1-41.4 34.1-66.1 44.6-25.6 10.8-52.9 16.3-81 16.3s-55.3-5.5-81-16.3c-24.8-10.5-47-25.5-66.1-44.6C89.8 384 74.8 361.7 64.3 337 53.5 311.3 48 284.1 48 256s5.5-55.3 16.3-81c10.5-24.8 25.5-47 44.6-66.1C128 89.8 150.3 74.8 175 64.3 200.7 53.5 227.9 48 256 48s55.3 5.5 81 16.3c24.8 10.5 47 25.5 66.1 44.6 19.1 19.1 34.1 41.4 44.6 66.1 10.8 25.6 16.3 52.9 16.3 81s-5.5 55.3-16.3 81c-10.5 24.7-25.5 47-44.6 66.1z" fill="currentColor"/><circle cx="256" cy="80" r="8" fill="currentColor"/><circle cx="256" cy="432" r="8" fill="currentColor"/><circle cx="432" cy="256" r="8" fill="currentColor"/><circle cx="80" cy="256" r="8" fill="currentColor"/><circle cx="168" cy="103.6" r="8" fill="currentColor"/><circle cx="344" cy="408.4" r="8" fill="currentColor"/><circle cx="408.4" cy="168" r="8" fill="currentColor"/><circle cx="103.6" cy="344" r="8" fill="currentColor"/><circle cx="103.6" cy="168" r="8" fill="currentColor"/><circle cx="408.4" cy="344" r="8" fill="currentColor"/><circle cx="344" cy="103.6" r="8" fill="currentColor"/><circle cx="168" cy="408.4" r="8" fill="currentColor"/><path d="M269.9 248c-2.9-5-8.1-7.8-13.4-8l-38-63.4c-2.3-3.8-7.2-5-11-2.7s-5 7.2-2.7 11l37.6 62.9c-2.9 4.8-3.2 11.1-.2 16.3 1.5 2.5 3.5 4.5 5.9 5.8V392c0 4.4 3.6 8 8 8s8-3.6 8-8V269.9c7.6-4.5 10.2-14.2 5.8-21.9z" fill="currentColor"/></svg>
</template>

CSS

.icon-ios-time-outline {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%2032C132.3%2032%2032%20132.3%2032%20256s100.3%20224%20224%20224%20224-100.3%20224-224S379.7%2032%20256%2032zm147.1%20371.1c-19.1%2019.1-41.4%2034.1-66.1%2044.6-25.6%2010.8-52.9%2016.3-81%2016.3s-55.3-5.5-81-16.3c-24.8-10.5-47-25.5-66.1-44.6C89.8%20384%2074.8%20361.7%2064.3%20337%2053.5%20311.3%2048%20284.1%2048%20256s5.5-55.3%2016.3-81c10.5-24.8%2025.5-47%2044.6-66.1C128%2089.8%20150.3%2074.8%20175%2064.3%20200.7%2053.5%20227.9%2048%20256%2048s55.3%205.5%2081%2016.3c24.8%2010.5%2047%2025.5%2066.1%2044.6%2019.1%2019.1%2034.1%2041.4%2044.6%2066.1%2010.8%2025.6%2016.3%2052.9%2016.3%2081s-5.5%2055.3-16.3%2081c-10.5%2024.7-25.5%2047-44.6%2066.1z%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22256%22%20cy%3D%2280%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22256%22%20cy%3D%22432%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22432%22%20cy%3D%22256%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%2280%22%20cy%3D%22256%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22168%22%20cy%3D%22103.6%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22408.4%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22408.4%22%20cy%3D%22168%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22103.6%22%20cy%3D%22344%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22103.6%22%20cy%3D%22168%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22408.4%22%20cy%3D%22344%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22103.6%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22168%22%20cy%3D%22408.4%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M269.9%20248c-2.9-5-8.1-7.8-13.4-8l-38-63.4c-2.3-3.8-7.2-5-11-2.7s-5%207.2-2.7%2011l37.6%2062.9c-2.9%204.8-3.2%2011.1-.2%2016.3%201.5%202.5%203.5%204.5%205.9%205.8V392c0%204.4%203.6%208%208%208s8-3.6%208-8V269.9c7.6-4.5%2010.2-14.2%205.8-21.9z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%2032C132.3%2032%2032%20132.3%2032%20256s100.3%20224%20224%20224%20224-100.3%20224-224S379.7%2032%20256%2032zm147.1%20371.1c-19.1%2019.1-41.4%2034.1-66.1%2044.6-25.6%2010.8-52.9%2016.3-81%2016.3s-55.3-5.5-81-16.3c-24.8-10.5-47-25.5-66.1-44.6C89.8%20384%2074.8%20361.7%2064.3%20337%2053.5%20311.3%2048%20284.1%2048%20256s5.5-55.3%2016.3-81c10.5-24.8%2025.5-47%2044.6-66.1C128%2089.8%20150.3%2074.8%20175%2064.3%20200.7%2053.5%20227.9%2048%20256%2048s55.3%205.5%2081%2016.3c24.8%2010.5%2047%2025.5%2066.1%2044.6%2019.1%2019.1%2034.1%2041.4%2044.6%2066.1%2010.8%2025.6%2016.3%2052.9%2016.3%2081s-5.5%2055.3-16.3%2081c-10.5%2024.7-25.5%2047-44.6%2066.1z%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22256%22%20cy%3D%2280%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22256%22%20cy%3D%22432%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22432%22%20cy%3D%22256%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%2280%22%20cy%3D%22256%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22168%22%20cy%3D%22103.6%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22408.4%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22408.4%22%20cy%3D%22168%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22103.6%22%20cy%3D%22344%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22103.6%22%20cy%3D%22168%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22408.4%22%20cy%3D%22344%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22103.6%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Ccircle%20cx%3D%22168%22%20cy%3D%22408.4%22%20r%3D%228%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M269.9%20248c-2.9-5-8.1-7.8-13.4-8l-38-63.4c-2.3-3.8-7.2-5-11-2.7s-5%207.2-2.7%2011l37.6%2062.9c-2.9%204.8-3.2%2011.1-.2%2016.3%201.5%202.5%203.5%204.5%205.9%205.8V392c0%204.4%203.6%208%208%208s8-3.6%208-8V269.9c7.6-4.5%2010.2-14.2%205.8-21.9z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/ios-time-outline.svg?color=%231a73e8&size=48