The Tabler yin yang icon depicts the Taoist symbol of balance and harmony between opposing forces, often used in UI to represent duality, balance, or philosophical concepts.
Common uses
- Balance/duality settings toggle
- Meditation or wellness app feature
- Philosophical or spiritual content section
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconYinYang } from '@tabler/icons-react';
<IconYinYang size={24} stroke={2} />Styles
Tabler ships this icon in 2 styles — each its own import:
outline
<IconYinYang size={24} stroke={2} />filled
<IconYinYangFilled size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Symbols
- Keywords
- equalitygoodevilbalancepeaceyinyangsignmarkemblemsymbolsbalance symbolduality icontaoist symbolharmony emblem
FAQ
- What does the yin yang icon represent?
- It represents the Taoist concept of dualism, where seemingly opposite or contrary forces are actually complementary, interconnected, and interdependent in the natural world.
- How do I use the yin yang icon in React?
- You can import and use it in your React application with: `import { IconYinYang } from '@tabler/icons-react'`.
- What is the license for the Tabler yin yang icon?
- The Tabler icons, including the yin yang icon, are available under the MIT license, which allows for free use in both personal and commercial projects.
Related icons
The same idea in other libraries, and near matches in Tabler.
Looking for something else? Search Tabler and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →