— LAB · OPEN SOURCE & EXPERIMENTOS

Cosas que hicimos por ninguna buena razón.

Open source. Demos a medias. Shaders que llevaron un fin de semana. Herramientas que usamos internamente y se nos olvidó mantener secretas.

— DEMO 01

Orbital Trace

80 puntos en un anillo que cicla el matiz. Canvas puro, ~30 líneas.

— DEMO 02

Flow Field

Partículas a la deriva por un campo vectorial tipo Perlin. Reinicia al clicar.

— DEMO 03

Truchet Tiles

Tiles de arco aleatorios componen texturas en loop infinito.

2026 · GITHUB ↗

Escala de tipografía responsiva con CSS clamp(), sin media queries

Una escala modular fluida que se redimensiona entre dos viewports con una sola declaración clamp() por encabezado. Elige base + ratio, copia CSS + config Tailwind.

HTMLCSSclamp()Modular scaleTypography
2026 · GITHUB ↗

Generador de sistema de color: un hex, cuatro formatos de salida

Pega un hex de marca. Obtienes una escala de 11 pasos, tokens semánticos, emparejamiento dark-mode, y salida lista para copiar a CSS, Tailwind, SCSS y Figma Tokens.

HTMLJavaScriptHSLDesign tokensTailwind
2026 · GITHUB ↗

Proxy de imagen PHP con negociación WebP

Un proxy PHP de 30 líneas que va a buscar imágenes a un CMS headless, negocia WebP vía cabecera Accept y las cachea con 30 días de cache inmutable. Todo en un solo archivo.

PHPcURLWebPCloudflare
2026 · GITHUB ↗

Sistema de portadas SVG generativas

La imagen de portada de este card fue renderizada server-side desde tu slug. Sin diseñador, sin subida, sin pipeline de assets. Geometría determinística + tipografía + cache.

PHPSVGcrc32Cache-Control
2026 · GITHUB ↗

i18n en PHP estático a escala OVH

Un stack i18n que funciona en hosting compartido barato donde el QSA de mod_rewrite se rompe: parsing del URL en PHP + reescritor de enlaces en JS al boot. Sin frameworks, sin build step.

PHPJavaScriptApacheCockpit CMS
2026 · GITHUB ↗

Tester de pipeline de color de marca

Un pequeño viewer WebGL que muestra un único color hero renderizado bajo tres condiciones de luz lado a lado. Mete un hex, comprueba si sobrevive a la mañana nublada de Lisboa.

WebGLThree.jsGLSLVue 3
2026 · GITHUB ↗

Script de auditoría de tours Matterport

Un pequeño script Node que recorre un tour Matterport y señala problemas habituales de calidad: salas inalcanzables, hotspots ausentes, transiciones rotas. Herramienta interna que ahora entregamos a clientes.

Node.jsMatterport SDKTypeScript
2026

Panel de código en vivo — lo que ves, mientras lees

El panel "hecho mientras lees" en la homepage es código real, ejecutándose. Aquí está cómo funciona el canvas en vivo + token stream — y lo que aprendimos afinándolo para repaint sub-100ms.

Canvas 2DrequestAnimationFrameJavaScript