Mosbius Design
MOSBIUS @UI

Resolución Radical:
Armonía Píxel a Píxel.

Cada píxel tiene un propósito. Diseñamos interfaces centradas en el usuario con la claridad de Apple y la integridad de Airbnb.

Claridad

Interfaces claras, directas y comprensibles que eliminan la ambigüedad.

Integridad

Cada parte sirve a un propósito único, ningún detalle es accidental.

Respeto

El contenido es el rey. La interfaz retrocede elegantemente para resaltar el contenido.

Interacción

El movimiento es un signo de vida. Respuestas significativas y naturales a cada toque.

ADN de Diseño

Sistema Atómico

Nuestra tabla periódica de diseño. Partículas atómicas enriquecidas con la jerarquía de color semántica de Apple y la tipografía holística de Airbnb.

Experiencia del Desarrollador

Eres Dueño del Código.
Sin Cajas Negras.

Trabajamos con la filosofía de "Código Abierto". En lugar de ocultar componentes en un paquete npm, los integramos directamente en tu proyecto. Control total, personalización total.

~npx mosbius-ui init
// Proje şematiklerini ve temelini kurar
~npx mosbius-ui add magnetic-button
// 'MagneticButton' bileşenini /components klasörüne kopyalar
✔ Başarıyla eklendi! (0.42s)

100/100 PSI

Cero sobrecarga en tiempo de ejecución. Optimizado con subconjunto de fuentes y tree-shaking.

Listo para RSC

Totalmente compatible con Next.js 16 Server Components. Envía javascript al cliente solo cuando es necesario.

Independiente

No depende de ninguna biblioteca de estilos. Puro Tailwind CSS 4 y React.

Código Abierto

El código es tuyo. Cámbialo, extiéndelo y personalízalo como desees.

Organismos Vivos

Patio de Componentes

Componentes vivos que respiran. Prueba variaciones, examina puntuaciones de accesibilidad y copia tu código.

Framer Motion Enter
Hover: Lift
Tap: Scale 0.98
import { Button } from '@mosbius/ui'
Lógica Espacial

Diseño y Ritmo

Armonía matemática y equilibrio óptico. Reglas de diseño sin CLS, centradas en el ser humano, construidas sobre un sistema de cuadrícula de 8pt.

12-Column Fluid Grid

4 Col
8 Col
12 Col
Padding: 24px (Mobile) / 48px (Desktop)

Cuadrícula Estricta 8pt

Todos los espaciados deben ser múltiplos de 8 (8, 16, 24, 32...). El ritmo vertical debe mantenerse.

8
16
24
32

Ancho Máx 70ch

Las líneas de texto deben permanecer dentro del límite de 60-75 caracteres (aprox. 600-800px) para legibilidad.

Alineación Óptica

El centro geométrico no siempre es correcto. Confía en el ojo humano y haz correcciones ópticas de +/- 1px.

Más Allá del Cumplimiento

Universal e Inclusivo

La accesibilidad no es una idea de último momento, es un pilar arquitectónico. Diseñando para cada cultura, cada capacidad y cada dispositivo.

Tarjeta de Puntuación a11y

Verificación de Cumplimiento en Vivo

Nav Teclado
TABENTER
Verif Contraste
4.5:1 (AA)
VoiceOver
"Button, Submit, Group"
<button aria-label="Submit" />

Respetar Preferencia

Cuando el usuario dice "Reducir Movimiento", las transiciones complejas dan paso a simples cambios de opacidad.

Animación Estándar

Tipografía Dinámica

Soporte de ampliación de texto hasta 200%.

AAA
ADN de Comunicación

Voz y Tono

Las palabras son parte del diseño. Construimos un vínculo de confianza con el usuario utilizando un lenguaje claro, humano e inclusivo.

Nuestro Idioma

Profesional pero Amigable

Estamos lejos del lenguaje robótico. Somos lo suficientemente humanos para decir "No podemos hacer esto en este momento" en lugar de expresiones frías como "Operación fallida".

Claro y Directo

Evitamos la Voz Pasiva. En lugar de "El archivo está siendo descargado", decimos "Descargando archivo" o "Descargar".

El uso de mayúsculas en oraciones es obligatorio.

Reglas de Escritura

Vago

Buraya Tıkla

Orientado a la Acción

Pruébalo Ahora

Title Case

Envía Tu Solicitud

Sentence Case

Envía tu solicitud

Formato

10MB / Tres errores

Precisión

10 MB / 3 errores

Error Técnico

Error del Sistema 404

Solución

Página no encontrada

Infraestructura de Diseño
@mosbius/ui