The Phosphor subtitles icon depicts a rectangle with lines, commonly used to represent closed captions or subtitle options in media players and accessibility settings.
Common uses
- Toggle subtitles on/off in a video player.
- Indicate available closed captions for a show.
- Accessibility options menu.
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { Subtitles } from '@phosphor-icons/react';
<Subtitles size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<Subtitles size={24} />thin
<Subtitles size={24} weight="thin" />light
<Subtitles size={24} weight="light" />bold
<Subtitles size={24} weight="bold" />fill
<Subtitles size={24} weight="fill" />duotone
<Subtitles size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- media
- Keywords
- subtitlestelevisiontvtranscribedtranscriptionaccessibilitya11ymediaclosed captionscaptionscc
FAQ
- What does the subtitles icon represent?
- It represents closed captions or subtitle functionality, often seen in media playback interfaces.
- How do I use the subtitles icon in React?
- You can import and use it like this: import { Subtitles } from '@phosphor-icons/react'.
- What is the license for this icon?
- The Phosphor icon library, including the subtitles icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Phosphor.
Looking for something else? Search Phosphor 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 →