Copy code import type { SVGProps } from "react";
export type IconProps = {
size?: number | string;
color?: string;
className?: string;
} & SVGProps<SVGSVGElement>;
export const Refresh = ({
size = 24,
color = "currentColor",
className,
...props
}: IconProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={size}
height={size}
fill={color}
className={className}
{...props}
>
<path d="M19.07 4.93a9.9 9.9 0 0 0-3.18-2.14A9.95 9.95 0 0 0 12 2v2c1.08 0 2.13.21 3.11.63.95.4 1.81.98 2.54 1.71s1.31 1.59 1.72 2.54c.42.99.63 2.03.63 3.11s-.21 2.13-.63 3.11c-.4.95-.98 1.81-1.72 2.54-.17.17-.34.32-.52.48L15 15.99v6h6l-2.45-2.45c.18-.15.36-.31.52-.48.92-.92 1.64-1.99 2.14-3.18.52-1.23.79-2.54.79-3.89s-.26-2.66-.79-3.89a9.9 9.9 0 0 0-2.14-3.18ZM4.93 19.07c.92.92 1.99 1.64 3.18 2.14 1.23.52 2.54.79 3.89.79v-2a7.9 7.9 0 0 1-3.11-.63c-.95-.4-1.81-.98-2.54-1.71s-1.31-1.59-1.72-2.54c-.42-.99-.63-2.03-.63-3.11s.21-2.13.63-3.11c.4-.95.98-1.81 1.72-2.54.17-.17.34-.32.52-.48L9 8.01V2H3l2.45 2.45c-.18.15-.36.31-.52.48-.92.92-1.64 1.99-2.14 3.18C2.27 9.34 2 10.65 2 12s.26 2.66.79 3.89c.5 1.19 1.22 2.26 2.14 3.18" />
</svg>
);Default · 24px · currentColor
UI examples Size, inline, toolbar, and dark UI — works for any icon style.
Refresh Icon — Free SVG Component The Refresh icon is a free, open-source SVG icon component built with TypeScript for React, Next.js, Vue, Remix, Svelte, and Astro projects. No npm install or package dependency required — just copy the component code and paste it into your project.
How to use Refresh icon in React Import the Refresh component from your icons folder. Use it as a standard React component with props: size (number), color (string), className (string), and all standard SVG attributes via spread props.
Example: <Refresh size={24} color=“currentColor“ className=“shrink-0“ />
Features Zero dependencies — no package install needed TypeScript ready with full type safety Fully customizable size, color, and className Works with Tailwind CSS, styled-components, CSS modules Accessible — supports aria attributes Tree-shakeable — only import what you use MIT licensed — free for commercial use Compatible frameworks React, Next.js (App Router & Pages Router), Vue, Remix, Svelte, Astro, Nuxt, Gatsby, Vite, Angular, Qwik.
Category: navigation Browse more navigation icons in the Next Icons library. All icons are hand-crafted SVGs optimized for web performance.