Una buena fuente script es difícil de encontrar. Soy extremadamente exigente cuando se trata de esta área particular de fuentes y tiendo a odiar la mayoría de lo que veo. Con esta publicación, puede omitir el trabajo de clasificar la basura y pasar directamente a las mejores fuentes y scripts manuscritos de Google que sean legibles, atractivos y perfectos para su sitio web.
Todas las fuentes se representan con un tratamiento CSS único (¡y vienen con el código que necesita para una implementación rápida!) También se proporcionan con Google Fonts, por lo que estará en funcionamiento con una copia y pegado rápidos, sin necesidad de descargas. !
Un hermoso y hermoso guión con buena legibilidad y formas de letras interesantes. Perfecto para titulares.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.3 «La escritura de Oleo», Helvética, oportunidad–alguacil; color: #2b2b2b; texto–La sombra: 4 píxeles 4 píxeles 0 píxeles rgb(0,0,0,0.1); } |
La langosta no necesita presentación, se ha convertido en los últimos años en uno de los platos más omnipresentes del planeta. La segunda versión le permite elegir entre versiones en negrita y delgada.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.3 «Langosta Dos», Helvética, oportunidad–alguacil; color: #2b2b2b; texto–La sombra: 1px 1px 0 píxeles #agregado, 4px 4px 0px rgba(0,0,0,0.15); } |
Me gusta mucho la naturaleza ornamental de este tipo de letra, las letras son grandes, audaces y bellamente curvadas. Use esto si quiere transmitir una sensación del viejo mundo.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.3 «Bordado de Berkshire», Helvética, oportunidad–alguacil; color: #2b2b2b; texto–La sombra: 1px 1px 0 píxeles #agregado, 4px 4px 0px rgba(0,0,0,0.15); } |
Merienda no es mi favorita, pero ciertamente tiene sus usos. Las letras tienen una sensación cepillada con una direccionalidad nítida que transmite bien el movimiento.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.2 «Merienda uno», Helvética, oportunidad–alguacil; color: rgb(0,0,0,0.7); texto–La sombra: 3 píxeles 3 píxeles 3 píxeles #fff; } |
Pacifico es simplemente un gran guión redondo y curvo que realmente tiene una sensación única. Es difícil encontrar un guión audaz con curvas tan hermosas y tanto carácter, así que asegúrese de marcar este como favorito.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.5 «Pacífica», Helvética, oportunidad–alguacil; color: #2b2b2b; texto–La sombra: 3 píxeles 3 píxeles 0 píxeles rgb(0,0,0,0.1), 7px 7px 0 píxeles rgb(0,0,0,0.05); } |
Si está buscando algo que parezca realmente escrito a mano, Just Another Hand es una buena opción. Para lanzar una bola curva visual, usé sombras para darle un efecto 3D, pero se ve muy bien (o mejor) incluso sin ellas.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.0 «Solo otra mano», Helvética, oportunidad–alguacil; color: #969595; texto–La sombra: 0 píxeles 3 píxeles 0 píxeles #5e5e5e, 0px 5px 0px #4d4d4d, 0px 7px 0px #3c3c3c, 0px 9px 0px #2b2b2b, 3px 8px 15px rgba(0,0,0,0.1), 3px 8px 5px rgba; } |
El Arizonia tiene una maravillosa sensación de fluidez con amplios arcos y movimientos suaves. Es un gran logotipo y realmente no se siente como algo que esperaría que estuviera disponible como fuente web en vivo.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.3 «Arizona», Helvética, oportunidad–alguacil; color: #2b2b2b; texto–La sombra: 4 píxeles 4 píxeles 0 píxeles rgb(0,0,0,0.1); } |
Cookie tiene una especie de encanto femenino de cuento de hadas que la convierte en una gran fuente para títulos de historias y similares. La próxima vez que necesite una sensación caprichosa, debe intentarlo.
HTML
CSS
|
h2 { FUENTE: 400 130px/0.8 «galletas», Helvética, oportunidad–alguacil; color: #fff; texto–La sombra: 4 píxeles 4 píxeles 3 píxeles rgb(0,0,0,0.1); } |
Great Vibes es un guión muy ornamentado como Arizonia, pero un poco más delgado y sofisticado. Las formas de las letras son realmente hermosas y definitivamente llamarán la atención.
HTML
CSS
|
h2 { FUENTE: 400 130px/0.8 «Grandes vibraciones», Helvética, oportunidad–alguacil; color: #fff; texto–La sombra: 4 píxeles 4 píxeles 3 píxeles rgb(0,0,0,0.1); } |
Leckerli Uno es gordo y utilitario. Es bastante masculino en términos de guiones y perfecto para declaraciones grandes y audaces.
HTML
CSS
|
h2 { FUENTE: 400 100px/1.2 «Leckerli Uno», Helvética, oportunidad–alguacil; color: #000; texto–La sombra: 2 píxeles 2 píxeles 0 píxeles rgb(0,0,0,0.2), 4 píxeles 4 píxeles 8 píxeles rgb(0,0,0,0.2); } |
¿Cuál es tu favorito?
Aquí, diez increíbles secuencias de comandos y fuentes manuscritas proporcionadas y listas para implementar. La biblioteca de fuentes de Google tiene más de cien de estas, pero no vale la pena usar muchas de ellas, por lo que esperamos que este artículo lo ayude a reducir el rebaño.
¿Cuál de las fuentes anteriores es tu favorita? ¿Has usado alguno de ellos en ejemplos en vivo? ¡Queremos ver!
