What does the moon icon represent?

It represents the moon, typically used for concepts like nighttime, dark mode, or weather-related information.

How do I use the moon icon in React?

You can import and use it with: import { IconMoon } from '@tabler/icons-react'. Then render it as .

The Tabler icon library, including the moon icon, is available under the MIT license.

Tabler · moon · MIT

The Tabler moon icon depicts a crescent moon, commonly used to represent nighttime, dark mode settings, or weather forecasts.

Install

npm i @tabler/icons-react

Import & render

import { IconMoon } from '@tabler/icons-react';

<IconMoon size={24} stroke={2} />

Tabler ships this icon in 2 styles — each its own import:

outline

<IconMoon size={24} stroke={2} />

filled

<IconMoonFilled size={24} stroke={2} />

Library: Tabler (5,093 icons)
License: MIT
viewBox: 0 0 24 24
Category: Weather
Keywords: nightdark modemoonclimateforecastmeteorologyatmosphericconditionsweathercrescent

What does the moon icon represent?: It represents the moon, typically used for concepts like nighttime, dark mode, or weather-related information.
How do I use the moon icon in React?: You can import and use it with: import { IconMoon } from '@tabler/icons-react'. Then render it as <IconMoon />.
What is the license for the Tabler moon icon?: The Tabler icon library, including the moon icon, is available under the MIT license.

The same idea in other libraries, and near matches in Tabler.