The Phosphor record icon depicts a solid circle, commonly used in user interfaces to initiate or indicate an active recording state for audio or video.
Common uses
- Start audio recording
- Indicate active video recording
- Voice memo button
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { Record } from '@phosphor-icons/react';
<Record size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<Record size={24} />thin
<Record size={24} weight="thin" />light
<Record size={24} weight="light" />bold
<Record size={24} weight="bold" />fill
<Record size={24} weight="fill" />duotone
<Record size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- media
- Keywords
- musicaudiorecordingrecordervoice memomediasystemrecordstoprecrecord button
FAQ
- What is the record icon used for?
- It's used to start or show an active recording, typically for audio or video.
- How do I use the record icon in React?
- Import it as `Record` from '@phosphor-icons/react' and use it as a component: `<Record />`.
- What is the license for the Phosphor record icon?
- The Phosphor icon library, including the record 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 →