v1.0
- Versión inicial con cinco estilos, modo Custom, interacción responsive, teclado y compatibilidad con movimiento reducido.
ComponenteFramer · React · TypeScript · Framer Motionv1.0.0
Type ApertureComponente de texto revelado con cursor para Framer
Titular de doble mensaje para Framer con apertura guiada por cursor, cinco estilos, control táctil, teclado y movimiento reducido.
ResponsiveAccesibilidad declaradaDemo aislada
Demo interactiva
Pruébalo como si ya fuera tuyo.
Prueba la interacción, los tamaños responsive y sus ajustes reales sin salir de la ficha.
Type Aperture / v1.0.0
Se abre a pantalla completa dentro de esta misma ficha.
Qué resuelve
Tipografía interactiva con dos mensajes, sin escribir código
Type Aperture es un componente interactivo de texto revelado para Framer. Al mover el cursor, una máscara circular descubre un segundo titular bajo el primero; con un clic o un toque el revelado se expande desde ese punto exacto. Sirve para titulares animados de portada, presentaciones de portafolio y tipografía de campañas editoriales. Hecho con Framer Motion, con cinco estilos, soporte táctil y de teclado, y respeto por el movimiento reducido.
01
Dos capas de texto multilínea editables
02
Revelado circular que sigue el cursor
03
Expansión desde el punto exacto del clic o toque
04
Cinco estilos dirigidos más el modo Custom
05
Comportamiento responsive con ratón, toque y teclado
06
Compatibilidad con movimiento reducido y Framer Canvas
Casos de uso
Situaciones documentadas para esta versión del producto.
- 01
Cabeceras de portfolios y estudios
- 02
Titulares de campañas editoriales
- 03
Mensajes de marca con doble significado
- 04
Aperturas interactivas de casos de estudio
- 05
Landing pages creativas
Galería del producto
Imágenes y vídeos publicados específicamente para esta versión.
Capacidades publicadas
Valores declarados y revisados para esta versión concreta; no se heredan automáticamente en una actualización.
- Animaciones
- Sí
- Interacción
- Sí
- Responsive
- Sí
- Modo oscuro
- No
- Accesibilidad declarada
- Sí
- CMS
- No
- Formularios
- No
- Propiedades configurables
- Sí
Compatibilidad
- Framer web projects
- Modern desktop browsers
- Modern mobile browsers
- Pointer, touch and keyboard input
Dependencias
- Framer
- Framer Motion
Requisitos
- A Framer project
- The verified Framer Component URL
Instalación y uso
Estas instrucciones se publican como parte del manifiesto de esta versión.
Instalar
- 01Completa la compra y abre la URL del componente de Framer incluida.
- 02Pega la URL del componente en el proyecto de Framer.
- 03Selecciona Type Aperture en el lienzo.
- 04Elige uno de los cinco estilos o cambia a Custom en el panel de propiedades.
- 05Sustituye los mensajes Primary y Reveal y ajusta tipografía, espaciado y apertura.
Documentación
- El componente usa 1180 × 620 px de forma predeterminada y se adapta por debajo de 700 px.
- Usa el puntero, el arrastre táctil o las flechas del teclado para mover la apertura.
- Haz clic, toca, pulsa Espacio o Enter para alternar el mensaje oculto completo.
- Los modos de movimiento reducido y renderizado estático eliminan animaciones no esenciales.
Accesibilidad
El manifiesto publicado marca esta versión como accesible y declara que su demo admite teclado. Es información del producto, no una certificación externa de conformidad.
- Uso con teclado
- Declarado compatible
- Uso con puntero
- Declarado compatible
Rendimiento
La demo solo se carga cuando la abres, se desmonta al cerrarla y no añade sus dependencias al bundle principal de SolveKit.
Historial de cambios
Licencias
Licencia comercial para un solo uso
Usa Type Aperture en un proyecto personal, comercial o de cliente en Framer. Cada proyecto adicional requiere otra licencia. Se prohíben la redistribución y la reventa.
Metadatos de descarga
Datos publicados para identificar el archivo de esta versión y comprobarlo después de descargarlo.
- Archivo
- Type-Aperture-v1.0.zip
- Tamaño
- 6,8 KB (6751 bytes)
- SHA-256
- 1369fa91658bd2ad6b8fe773462e3b227009f6b4c59ff90a5c5add00999eb68c
Preguntas frecuentes
¿Necesita editar código?
No. Se instala con la URL del componente incluida y se configura desde el panel de propiedades de Framer.
¿Funciona en móvil?
Sí. Incluye composición compacta, arrastre táctil y revelado mediante toque.
¿Puede utilizarse con teclado?
Sí. Las flechas mueven la apertura y Espacio o Enter alternan el revelado completo.
¿Respeta el movimiento reducido?
Sí. Elimina las transiciones no esenciales y el movimiento automático cuando el sistema solicita movimiento reducido.