Normalmente para añadir efectos sobre textos utilizamos algunos trucos y efectos de Photoshop, pero si hablamos de diseño web entonces podemos conseguir efectos realmente impresionantes tan solo aplicando algo de CSS3.
La ventaja de este método es que la cantidad de datos que se tienen que descargar para visualizar una página web es menor que si utilizarais imágenes estáticas.
El dominio de las propiedades de CSS3 no sólo ayuda a los diseñadores para crear efectos espectaculares de texto, también ahora las propiedades CSS3 son compatibles con muchos navegadores actuales, por lo tanto, la disminución de problemas de compatibilidad.
La siguiente selección de 15 increibles tuturiales con efectos que se pueden aplicar al texto, os ayudará a crear diseños inteligentes en pocos minutos mediante los estilos CSS3.
1. Code Snippet: Create 3D Text Effect Using CSS3
2. CSS3 Background Clip
3. CSS Cookbook
4. Glass Text Effect
5. CSS3 Tilt-shift Text
5. Flashlight CSS Tutorial
6. Cool Text Effects Using CSS3 Text-Shadow
7. How to Create Inset Text With CSS3
8. Matrix Animation with WebKit CSS3
9. Subtle CSS3 Typography that you’d Swear was Made in Photoshop
10. CSS Gradient Text Effect
11. Text Rotation with CSS
12. Cool Anaglyphic Text Effect with CSS
13. Letterpress Effect With CSS Text-Shadow
14. Create Beautiful CSS3 Typography
15. How to Create Inset Typography with CSS3
Janeth Kent
Licenciada en Bellas Artes y programadora por pasión. Cuando tengo un rato retoco fotos, edito vídeos y diseño cosas. El resto del tiempo escribo en MA-NO WEB DESIGN END DEVELOPMENT.
Artículos relacionados
Validación de formularios HTML usando BULMA y vanilla JavaScript
Hoy vamos a escribir sobre los formularios de contacto y cómo validarlos usando JavaScript. El formulario de contacto parece ser una de las características principales de toda página web básica. Es…
Cómo usar el efecto Parallax.Js en tu sitio web
Hoy vamos a escribir sobre el efecto de parallax, similar al desplazamiento de parallax, y cómo implementarlo para mejorar su página de aterrizaje. En webdev, dicen que primero el móvil…
Modo oscuro persistente con CSS y JS
Recientemente escribimos acerca de cómo hacer un modo de color o tema alternativo intercambiable, una característica muy útil y popular para los sitios web. El artículo de hoy tratará sobre…
Modo oscuro en el sitio web usando CSS y JavaScript
En el artículo de hoy vamos a aprender a construir más o menos estándar en estos días en las páginas web y que es el modo de color alternativo y…
El concepto de Modelo-Vista-Controlador (MVC) explicado
En la ingeniería de software, usamos patrones de diseño como soluciones reutilizables para un problema común, un patrón es como una plantilla de cómo resolver un problema. El Modelo-Vista-Controlador (MVC) es…
Javascript: los operadores Spread y Rest
En el artículo de hoy vamos a hablar de una de las características de la versión ES6 (ECMAScript 2015) de JavaScript que es el operador Spreadasí como el operador Rest. Estas…
Introducción a RegExp - Expresiones regulares
Hoy vamos a escribir sobre las Expresiones Regulares conocidas como regex o regexp abreviado, un concepto muy útil de uso de patrones de búsqueda. Seguramente usted estaba en una situación en…
Cookies HTTP: cómo funcionan y cómo usarlas
Hoy vamos a escribir sobre la forma de almacenar datos en un navegador, por qué los sitios web utilizan cookies y cómo funcionan en detalle. Continúa leyendo para averiguar cómo implementarlas…
Cómo usar el Masking en CSS
Cuando recortas un elemento usando la propiedad de clip-path, el área recortada se vuelve invisible. Si en cambio quieres hacer opaca una parte de la imagen o aplicarle algún otro…
Cómo escribir nuestra propia Política de Privacidad
En este artículo hablaremos de las declaraciones de la Política de Privacidad, de cómo puedes escribir una y ponerla en práctica en tu página. ¿Por qué apareció? Hoy en día, cuando navegamos…
El mejor software y aplicaciones gratuitos de streaming en directo para todas las plataformas
Estamos en una lenta transición hacia un mundo hecho de transmisiones en streaming. Ya sea que quieras transmitir en vivo o capturar contenido de la web, las opciones son ilimitadas.…
Guía sencilla para convertir imágenes a WebP en PHP
El 30 de septiembre de 2010, Google anunció la publicación de un nuevo estándar abierto para la compresión con pérdida de gráficos de 24 bits en la web. La base…