35 caracteres · gratis para copiar

Formas geométricas como caracteres

El bloque de Formas Geométricas en U+25A0 a U+25FF es el caballo de batalla de las interfaces basadas en texto: círculos, cuadrados, triángulos y diamantes, casi todos suministrados como un par relleno y con contorno en dos o tres tamaños. Ese emparejamiento es lo que te permite mostrar dos estados, dos jugadores o dos prioridades sin depender del color. Copia cualquier carácter de abajo; cada uno aparece con su nombre Unicode y su punto de código.

Círculos

Rellenos, huecos, y los rellenos parciales usados para valoraciones, fases y estados de interruptor.

Cuadrados

Tres tamaños en relleno y hueco. El par pequeño hace mejores viñetas que un simple punto.

Triángulos

Las cuatro direcciones en dos tamaños. El conjunto grande relleno también funciona como controles de reproducción multimedia.

Diamantes y rombos

Los diamantes se leen como "especiales" sin gritar — la opción habitual para un separador decorativo.

Haz clic en cualquier carácter para copiarlo. No se descarga nada: son caracteres de texto, no imágenes.

Bloques Unicode

  • U+25A0–U+25FF Formas Geométricas
  • U+2756 Dingbats

Cómo usar Formas Geométricas

01

Empareja relleno con hueco para mostrar estado

Casi cada forma aquí viene como un par relleno y con contorno. Usar ● frente a ○ para encendido y apagado, o hecho y pendiente, comunica la diferencia por forma — así que sobrevive a una impresión en escala de grises y a la visión daltónica de una forma en que rojo contra verde no lo hace.

02

Usa las variantes pequeñas como viñetas

El cuadrado pequeño ▪ y la viñeta blanca ◦ quedan mejor contra el texto del cuerpo que un ■ de tamaño completo. Las listas anidadas se leen bien como • luego ◦ luego ▪.

03

Usa los círculos parciales para el progreso

○ ◔ ◐ ◕ ● da cinco pasos claros de finalización en un solo carácter cada uno — un indicador de progreso compacto para una celda de tabla o una línea de registro.

04

Coloréalos desde CSS

Son texto, así que `color` se aplica directamente. Una fila de ● en cinco colores distintos no necesita imágenes ni SVG, y se mantiene nítida a cualquier zoom.

Acerca de Formas Geométricas

El bloque de Formas Geométricas es el rango más discretamente útil de Unicode. Su idea organizadora es el par: para casi cada forma hay una versión rellena y una con contorno, y a menudo dos o tres tamaños de cada una. Esa redundancia parece un desperdicio hasta que necesitas mostrar dos estados en un contexto monocromo — una terminal, una impresión, un correo de texto plano — y descubres que el contraste de forma sigue funcionando donde el contraste de color no lo hace.

Esa propiedad es la razón por la que estos caracteres están en todas partes en el diseño de interfaces. Los círculos rellenos y huecos son botones de radio y puntos de carrusel. Los triángulos son flechas de despliegue y controles de transporte multimedia. Los cuadrados pequeños son viñetas. Como son texto, cada uno hereda el tamaño de fuente y el color circundantes, así que un conjunto de iconos construido con ellos no necesita hoja de sprites, ni fuente de iconos, ni SVG — y nunca carga tarde ni deja de cargar.

Los círculos de relleno parcial en U+25D0 a U+25D3, y las variantes de cuarto de relleno cercanas a ellos, son una pequeña pieza de vocabulario de diseño que casi nadie encuentra. Una secuencia de vacío a lleno te da un indicador de progreso o valoración que ocupa exactamente una celda de carácter, por lo que aparece en paneles de control de línea de comandos y tablas de estado donde el espacio horizontal escasea.

Este sitio se apoya mucho en el bloque. Cuatro en Raya y Reversi usan ● y ○ para los dos jugadores; Simon usa los triángulos grandes para sus cuatro paneles; Apaga las Luces y Memorama usan cuadrados y diamantes. El color se añade encima con CSS como refuerzo, pero las formas llevan el significado por sí solas — que es lo que hace que los tableros sean legibles para un jugador daltónico.

Juegos dibujados con estos caracteres

Todos los tableros de este sitio están construidos con Unicode, no con sprites. Estos usan los caracteres de arriba.

Preguntas frecuentes

¿Cuál es la diferencia entre ● y ○?

Son las versiones rellena y hueca del mismo círculo. Unicode las llama "black circle" y "white circle", pero esos nombres describen el relleno, no el color — ambas son texto, así que puedes dibujar cualquiera en el color que quieras. Emparejarlas muestra dos estados sin depender del color en absoluto.

¿Qué símbolos de forma sirven como buenas viñetas?

La viñeta • (U+2022) es la estándar, con la viñeta blanca ◦ y el cuadrado pequeño ▪ para niveles anidados. El ■ y el ● de tamaño completo suelen ser demasiado pesados contra el texto del cuerpo. Un anidamiento habitual es • luego ◦ luego ▪.

¿Puedo usar formas geométricas en lugar de iconos?

Para indicadores simples, sí, y hay ventajas reales: sin hoja de sprites, sin fuente de iconos, sin solicitud extra, y heredan el color y el tamaño del texto automáticamente, así que nunca cargan tarde ni se desalinean. Los triángulos funcionan como flechas de despliegue y botones de reproducción, los círculos como estados de radio y puntos de estado.

¿Por qué algunas formas se ven más grandes que otras en la misma fuente?

Unicode codifica explícitamente varios tamaños — pequeño, mediano y regular — y las fuentes también dibujan el mismo punto de código con distintos pesos ópticos. Si una fila de formas se ve desigual, probablemente estés mezclando variantes de tamaño como ▪ U+25AA con ■ U+25A0. Mantente en una sola clase de tamaño dentro de una fila.

¿Estas formas funcionan como emoji?

Unas pocas tienen presentaciones de emoji y pueden llegar precoloreadas en algunas plataformas. Añade el selector de variación de texto U+FE0E para forzar el glifo monocromo de texto para que tome tu color de CSS. La mayor parte del bloque es solo texto y no necesita ese tratamiento.

Support the arcade

¿Disfrutas los juegos?

UnicodeGames es gratis, no tiene anuncios y nunca los tendrá. Si alegró tu descanso para el café, puedes devolver el favor.

Invítame un café

One-off · No account needed · Handled by Buy Me a Coffee