tide-high icon

Tide high: high tide, rising tide, rising water. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Animated tide-high-rise · line-round

The swell rolls one whole wave toward the shore on the right. The arrow dips, shoots up off the top, and a new arrow rises up out of the water and settles.

Download SVG

Native SVG animation, with no CSS or script. It loops by itself. Inline it to take the text color: in an <img> it draws black. To play it once on hover or click, run 0.25 s to 2.85 s. Examples and helper.

Code line-round

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M7.5 1C7.638 1 7.756 1.049 7.854 1.146L10.854 4.146C10.951 4.244 11 4.362 11 4.5C11 4.638 10.951 4.756 10.854 4.854C10.754 4.953 10.636 5.003 10.5 5.003C10.364 5.003 10.246 4.953 10.146 4.854L8 2.707L8 6.5C8 6.641 7.952 6.759 7.856 6.856C7.759 6.952 7.641 7 7.5 7C7.359 7 7.241 6.952 7.144 6.856C7.048 6.759 7 6.641 7 6.5L7 2.707L4.854 4.854C4.754 4.953 4.636 5.003 4.5 5.003C4.364 5.003 4.246 4.953 4.146 4.854C4.047 4.754 3.997 4.636 3.997 4.5C3.997 4.364 4.047 4.246 4.146 4.146L7.146 1.146C7.244 1.049 7.362 1 7.5 1ZM2.57 9.759C2.838 9.92 3.148 10 3.5 10C3.852 10 4.162 9.92 4.43 9.759C4.543 9.691 4.662 9.602 4.786 9.492C4.867 9.421 4.987 9.306 5.146 9.146C5.32 8.972 5.456 8.843 5.552 8.758C5.722 8.607 5.89 8.483 6.055 8.384C6.482 8.128 6.963 8 7.5 8C8.037 8 8.518 8.128 8.945 8.384C9.11 8.483 9.278 8.607 9.448 8.758C9.544 8.843 9.68 8.972 9.854 9.146C10.013 9.306 10.133 9.421 10.214 9.492C10.338 9.602 10.457 9.691 10.57 9.759C10.838 9.92 11.148 10 11.5 10C11.852 10 12.162 9.92 12.43 9.759C12.543 9.691 12.662 9.602 12.786 9.492C12.867 9.421 12.987 9.306 13.146 9.146C13.246 9.047 13.364 8.997 13.5 8.997C13.636 8.997 13.754 9.047 13.854 9.146C13.953 9.246 14.003 9.364 14.003 9.5C14.003 9.636 13.953 9.754 13.854 9.854C13.68 10.028 13.544 10.157 13.448 10.242C13.278 10.393 13.11 10.517 12.945 10.616C12.518 10.872 12.037 11 11.5 11C10.963 11 10.482 10.872 10.055 10.616C9.89 10.517 9.722 10.393 9.552 10.242C9.456 10.157 9.32 10.028 9.146 9.854C8.987 9.694 8.867 9.579 8.786 9.508C8.662 9.398 8.543 9.309 8.43 9.241C8.162 9.08 7.852 9 7.5 9C7.148 9 6.838 9.08 6.57 9.241C6.457 9.309 6.338 9.398 6.214 9.508C6.133 9.579 6.013 9.694 5.854 9.854C5.68 10.028 5.544 10.157 5.448 10.242C5.278 10.393 5.11 10.517 4.945 10.616C4.518 10.872 4.037 11 3.5 11C2.963 11 2.482 10.872 2.055 10.616C1.89 10.517 1.722 10.393 1.552 10.242C1.456 10.157 1.32 10.028 1.146 9.854C1.047 9.754 0.997 9.636 0.997 9.5C0.997 9.364 1.047 9.246 1.146 9.146C1.244 9.049 1.362 9 1.5 9C1.638 9 1.756 9.049 1.854 9.146C2.013 9.306 2.133 9.421 2.214 9.492C2.338 9.602 2.457 9.691 2.57 9.759ZM2.214 13.492C2.338 13.602 2.457 13.691 2.57 13.759C2.838 13.92 3.148 14 3.5 14C3.852 14 4.162 13.92 4.43 13.759C4.543 13.691 4.662 13.602 4.786 13.492C4.867 13.421 4.987 13.306 5.146 13.146C5.32 12.972 5.456 12.843 5.552 12.758C5.722 12.607 5.89 12.483 6.055 12.384C6.482 12.128 6.963 12 7.5 12C8.037 12 8.518 12.128 8.945 12.384C9.11 12.483 9.278 12.607 9.448 12.758C9.544 12.843 9.68 12.972 9.854 13.146C10.013 13.306 10.133 13.421 10.214 13.492C10.338 13.602 10.457 13.691 10.57 13.759C10.838 13.92 11.148 14 11.5 14C11.852 14 12.162 13.92 12.43 13.759C12.543 13.691 12.662 13.602 12.786 13.492C12.867 13.421 12.987 13.306 13.146 13.146C13.246 13.047 13.364 12.997 13.5 12.997C13.636 12.997 13.754 13.047 13.854 13.146C13.953 13.246 14.003 13.364 14.003 13.5C14.003 13.636 13.953 13.754 13.854 13.854C13.68 14.028 13.544 14.157 13.448 14.242C13.278 14.393 13.11 14.517 12.945 14.616C12.518 14.872 12.037 15 11.5 15C10.963 15 10.482 14.872 10.055 14.616C9.89 14.517 9.722 14.393 9.552 14.242C9.456 14.157 9.32 14.028 9.146 13.854C8.987 13.694 8.867 13.579 8.786 13.508C8.662 13.398 8.543 13.309 8.43 13.241C8.162 13.08 7.852 13 7.5 13C7.148 13 6.838 13.08 6.57 13.241C6.457 13.309 6.338 13.398 6.214 13.508C6.133 13.579 6.013 13.694 5.854 13.854C5.68 14.028 5.544 14.157 5.448 14.242C5.278 14.393 5.11 14.517 4.945 14.616C4.518 14.872 4.037 15 3.5 15C2.963 15 2.482 14.872 2.055 14.616C1.89 14.517 1.722 14.393 1.552 14.242C1.456 14.157 1.32 14.028 1.146 13.854C1.047 13.754 0.997 13.636 0.997 13.5C0.997 13.364 1.047 13.246 1.146 13.146C1.244 13.049 1.362 13 1.5 13C1.638 13 1.756 13.049 1.854 13.146C2.013 13.306 2.133 13.421 2.214 13.492Z"/></svg>

React

// Gentleface "tide-high" (line-round), MIT. https://gentleface.com/icons/tide-high
import type { SVGProps } from 'react';

export function TideHighIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M7.5 1C7.638 1 7.756 1.049 7.854 1.146L10.854 4.146C10.951 4.244 11 4.362 11 4.5C11 4.638 10.951 4.756 10.854 4.854C10.754 4.953 10.636 5.003 10.5 5.003C10.364 5.003 10.246 4.953 10.146 4.854L8 2.707L8 6.5C8 6.641 7.952 6.759 7.856 6.856C7.759 6.952 7.641 7 7.5 7C7.359 7 7.241 6.952 7.144 6.856C7.048 6.759 7 6.641 7 6.5L7 2.707L4.854 4.854C4.754 4.953 4.636 5.003 4.5 5.003C4.364 5.003 4.246 4.953 4.146 4.854C4.047 4.754 3.997 4.636 3.997 4.5C3.997 4.364 4.047 4.246 4.146 4.146L7.146 1.146C7.244 1.049 7.362 1 7.5 1ZM2.57 9.759C2.838 9.92 3.148 10 3.5 10C3.852 10 4.162 9.92 4.43 9.759C4.543 9.691 4.662 9.602 4.786 9.492C4.867 9.421 4.987 9.306 5.146 9.146C5.32 8.972 5.456 8.843 5.552 8.758C5.722 8.607 5.89 8.483 6.055 8.384C6.482 8.128 6.963 8 7.5 8C8.037 8 8.518 8.128 8.945 8.384C9.11 8.483 9.278 8.607 9.448 8.758C9.544 8.843 9.68 8.972 9.854 9.146C10.013 9.306 10.133 9.421 10.214 9.492C10.338 9.602 10.457 9.691 10.57 9.759C10.838 9.92 11.148 10 11.5 10C11.852 10 12.162 9.92 12.43 9.759C12.543 9.691 12.662 9.602 12.786 9.492C12.867 9.421 12.987 9.306 13.146 9.146C13.246 9.047 13.364 8.997 13.5 8.997C13.636 8.997 13.754 9.047 13.854 9.146C13.953 9.246 14.003 9.364 14.003 9.5C14.003 9.636 13.953 9.754 13.854 9.854C13.68 10.028 13.544 10.157 13.448 10.242C13.278 10.393 13.11 10.517 12.945 10.616C12.518 10.872 12.037 11 11.5 11C10.963 11 10.482 10.872 10.055 10.616C9.89 10.517 9.722 10.393 9.552 10.242C9.456 10.157 9.32 10.028 9.146 9.854C8.987 9.694 8.867 9.579 8.786 9.508C8.662 9.398 8.543 9.309 8.43 9.241C8.162 9.08 7.852 9 7.5 9C7.148 9 6.838 9.08 6.57 9.241C6.457 9.309 6.338 9.398 6.214 9.508C6.133 9.579 6.013 9.694 5.854 9.854C5.68 10.028 5.544 10.157 5.448 10.242C5.278 10.393 5.11 10.517 4.945 10.616C4.518 10.872 4.037 11 3.5 11C2.963 11 2.482 10.872 2.055 10.616C1.89 10.517 1.722 10.393 1.552 10.242C1.456 10.157 1.32 10.028 1.146 9.854C1.047 9.754 0.997 9.636 0.997 9.5C0.997 9.364 1.047 9.246 1.146 9.146C1.244 9.049 1.362 9 1.5 9C1.638 9 1.756 9.049 1.854 9.146C2.013 9.306 2.133 9.421 2.214 9.492C2.338 9.602 2.457 9.691 2.57 9.759ZM2.214 13.492C2.338 13.602 2.457 13.691 2.57 13.759C2.838 13.92 3.148 14 3.5 14C3.852 14 4.162 13.92 4.43 13.759C4.543 13.691 4.662 13.602 4.786 13.492C4.867 13.421 4.987 13.306 5.146 13.146C5.32 12.972 5.456 12.843 5.552 12.758C5.722 12.607 5.89 12.483 6.055 12.384C6.482 12.128 6.963 12 7.5 12C8.037 12 8.518 12.128 8.945 12.384C9.11 12.483 9.278 12.607 9.448 12.758C9.544 12.843 9.68 12.972 9.854 13.146C10.013 13.306 10.133 13.421 10.214 13.492C10.338 13.602 10.457 13.691 10.57 13.759C10.838 13.92 11.148 14 11.5 14C11.852 14 12.162 13.92 12.43 13.759C12.543 13.691 12.662 13.602 12.786 13.492C12.867 13.421 12.987 13.306 13.146 13.146C13.246 13.047 13.364 12.997 13.5 12.997C13.636 12.997 13.754 13.047 13.854 13.146C13.953 13.246 14.003 13.364 14.003 13.5C14.003 13.636 13.953 13.754 13.854 13.854C13.68 14.028 13.544 14.157 13.448 14.242C13.278 14.393 13.11 14.517 12.945 14.616C12.518 14.872 12.037 15 11.5 15C10.963 15 10.482 14.872 10.055 14.616C9.89 14.517 9.722 14.393 9.552 14.242C9.456 14.157 9.32 14.028 9.146 13.854C8.987 13.694 8.867 13.579 8.786 13.508C8.662 13.398 8.543 13.309 8.43 13.241C8.162 13.08 7.852 13 7.5 13C7.148 13 6.838 13.08 6.57 13.241C6.457 13.309 6.338 13.398 6.214 13.508C6.133 13.579 6.013 13.694 5.854 13.854C5.68 14.028 5.544 14.157 5.448 14.242C5.278 14.393 5.11 14.517 4.945 14.616C4.518 14.872 4.037 15 3.5 15C2.963 15 2.482 14.872 2.055 14.616C1.89 14.517 1.722 14.393 1.552 14.242C1.456 14.157 1.32 14.028 1.146 13.854C1.047 13.754 0.997 13.636 0.997 13.5C0.997 13.364 1.047 13.246 1.146 13.146C1.244 13.049 1.362 13 1.5 13C1.638 13 1.756 13.049 1.854 13.146C2.013 13.306 2.133 13.421 2.214 13.492Z" />
    </svg>
  );
}

Vue

Vue: see /icons/tide-high.md

Svelte

Svelte: see /icons/tide-high.md

HTML img

HTML img: see /icons/tide-high.md

CSS

CSS: see /icons/tide-high.md

Data URL

Data URL: see /icons/tide-high.md

Sprite

Sprite: see /icons/tide-high.md

SwiftUI

SwiftUI: see /icons/tide-high.md

Compose

Compose: see /icons/tide-high.md

Android XML

Android XML: see /icons/tide-high.md

Flutter

Flutter: see /icons/tide-high.md

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

With npm: import { TideHighIcon } from '@gentleface/react'; (setup).

Meaning

Use it for

high tide, rising tide, rising water

Tags

high tide, rising tide, rising water, flood tide, sea level, water level, tide, waves, ocean, coast

Category

Weather

Component name

TideHighIcon

History

2026-11-06 20 px drawn, 24 px drawn, added, released in 0.4.0

Since

version 0.4.0

Family 50

air-quality avalanche celsius earthquake eclipse fahrenheit flood haze hurricane landslide moon moon-off

More weather icons

cloud-drizzle cloud-fog cloud-hail cloud-lightning cloud-moon cloud-moon-rain cloud-rain cloud-rain-heavy cloud-rain-wind cloud-sleet cloud-snow cloud-snow-wind cloud-sun cloud-sun-rain clouds droplet · all weather icons

For agents

Metadata: /icons/tide-high.json · Markdown: /icons/tide-high.md · SVG: https://gentleface.com/svg/{style}/16/tide-high.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/tide-high.png

tide-high icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp