Lo que salió de ideas ganadoras: JSON a YAML, cron en cristiano, probador de regex, Base64 en los dos sentidos, HTML a PHP, colores, tramas SVG, tema —claro u oscuro, con plantillas de color— y config. Cada pestaña tiene su propio enlace para compartirla.
Enlace directo:tuweb.dev/herramientas#json-yaml
Base64 no cifra: solo cambia la forma de los mismos bytes. Cualquiera lo deshace, así que no escondas ahí nada que importe.
Esta web seguirá siendo Astro: en PHP no habría ventana de ideas ni base de datos que se publique sola. Lo que sí se puede es llevarte cualquier página de aquí en PHP, que es lo que hace este panel.
Lo que elijas aquí repinta la web al momento y se guarda en este navegador. El fondo está en la pestaña de Tema.
La web tiene dos temas: papel claro y noche cálida, los dos con el naranja de casa y la misma monoespaciada. Aquí se elige la plantilla de colores, el modo, el color primario y el fondo, y todo se queda en este navegador.
Una plantilla trae puesto todo: fondo, texto, líneas, paneles, acento y modo. «De casa» es la web tal cual está en el repo.
Con «el del sistema» la web cambia sola cuando lo hace tu equipo. El acento se aclara u oscurece según el fondo, para que siempre se lea.
En la pestaña de Colores puedes afinarlo en cualquier formato.
Así queda: acento, realce,apagado yun botón.
Se guarda en este navegador y solo lo ves tú. Los demás siguen viendo el suyo.
Las variables de src/styles/global.css, con un input cada una. Lo que toques manda sobre el tema de casa hasta que lo restablezcas. Los colores por defecto son los del tema claro; si tocas uno, ese valor manda también en el modo oscuro.
| Variable | Valor | Por defecto | Restablecer |
|---|---|---|---|
| Colores | |||
--color-bgFondo | #fdf6ef | ||
--color-fgTexto | #3b2d24 | ||
--color-mutedTexto apagado | #7a6152 | ||
--color-lineLíneas | #e8d9c8 | ||
--color-panelPaneles | #f7ece1 | ||
--color-accentAcento | #c2410c | ||
--color-markRealce | | ||
| Tipografía | |||
--text-xsTexto pequeño | px | 13px | |
--text-smTexto normal | px | 15px | |
--text-baseTexto de cuerpo | px | 16px | |
--text-lgTexto grande | px | 18px | |
Esto solo cambia tu navegador. Para que lo vea todo el mundo, copia el CSS y proponlo como idea.