Botones

Expanding disc mute toggle

Expanding disc mute toggle: Un ícono redondo alterna donde un disco oscuro crece desde el centro para tragarse la cara pastel, volteando el glifo a claro a medida que pasa por debajo.

Press the pad to flood it dark and mute the channel, press again to drain.

Cómo usar Expanding disc mute toggle

Expanding disc mute toggle se presenta con el formato de vista previa «en línea» y el tema «claro/oscuro».

Personalizar la vista previa

Estos controles se pasan a la demo. Los valores y límites describen la vista previa; consulta la implementación para conocer todas sus props.

Control	Tipo	Valor inicial	Límites de la vista previa
`size`	`number`	`60`	De 36 a 96; paso 2
`accent`	`color`	`#1F2937`	Los metadatos no indican otro límite.
`restTint`	`color`	`#CDBFF7`	Los metadatos no indican otro límite.
`duration`	`number`	`0.2`	De 0.08 a 0.8; paso 0.02
`glyph`	`select`	`speaker`	Opciones: speaker, bell, microphone
`startOn`	`boolean`	`false`	Los metadatos no indican otro límite.

¿Para qué frameworks está disponible Expanding disc mute toggle?

Expanding disc mute toggle está disponible para React, Vue, Svelte, Astro, HTML. La vista previa usa React; las observaciones sobre el código corresponden a index.tsx. Revisa la versión elegida antes de asumir que ofrece las mismas interacciones.

¿Qué dependencias tiene Expanding disc mute toggle?

Los metadatos de React no indican dependencias npm adicionales a React.

¿Qué detalles de accesibilidad se observan en Expanding disc mute toggle?

El código React de Expanding disc mute toggle incluye: elementos nativos (button); atributos y manejadores (aria-hidden, aria-label, aria-pressed). Son observaciones del código. Comprueba los nombres accesibles, el orden del foco y el comportamiento del teclado en la página completa.

¿Cómo maneja Expanding disc mute toggle el movimiento reducido?

Expanding disc mute toggle consulta la preferencia de movimiento en su código React mediante matchMedia(prefers-reduced-motion). Revisa la implementación completa, los estilos compartidos y la versión elegida con movimiento reducido activado; estas observaciones no garantizan que se detengan todas las animaciones.

Conecta tu agente

Componentes abiertos relacionados

Imagen fija del componente Quarter Turn Add Button de Fieldbook, de la categoría Botones.

2568Quarter Turn Add ButtonBotonesUn signo más con un círculo que gira un cuarto de revolución y se solidifica cuando se le apunta, luego cambia instantáneamente a un trazo ligero mientras se sostiene.

2476Icon reveal chipBotonesUn pequeño chip delineado que se inunda con su acento al pasar el mouse mientras la etiqueta se desliza hacia la izquierda y un glifo oculto se desvanece desde la derecha.

1640Latching icon toggleBotonesUn botón cuadrado que se enciende y apaga: una placa llena se desvanece, el glifo se intercambia por su contraparte coincidente y un título al lado explica el estado en palabras.

2037Shrinking cap icon rowBotonesUna fila de botones de íconos redondos cuyo relleno se esconde detrás de una tapa oscura que se colapsa al pasar el mouse, descubriendo el color desde el borde hacia adentro.

Imagen fija del componente Captioned Like Button de Fieldbook, de la categoría Botones.

2550Captioned Like ButtonBotonesUn botón de corazón solo con ícono que revela un título que se eleva desde abajo al pasar el cursor o al enfocar, y se llena con un rápido sobrepaso cuando se desea.

Imagen fija del componente Channel tile row de Fieldbook, de la categoría Botones.

2313Channel tile rowBotonesUna fila envolvente de mosaicos de íconos cuadrados debajo de un título pequeño, donde cada mosaico se funde con su propio color reservado al pasar el mouse.