A list of #Font Awesome #icons and their #CSS content values by @astrotim

A list of #Font Awesome #icons and their #CSS content values by @astrotim

fuente: http://astronautweb.co/snippet/font-awesome/

 

Interesante artículo con el código de muchos iconos para insertar en nuestro HTML a traves de CSS

Anuncios

whatfontis.com: obtener #tipografia de una #imagen / get #font of #jpg

whatfontis.com: obtener #tipografia de una #imagen / get #font of #jpg

whatfontis-com-obtener-tipografia-de-una-imagen-get-font-of-jpg

Hola a tod@s

Gracias a whatfontis.com podremos obtener el nombre de la tipografia que se ha usado en una imagen

Solo tenemos que subir la imagen e indicar en el formulario si el fondo es oscuro o no

2017-02-03_175329

En la siguiente pantalla tendremos que rellenar un formulario con las letras que la web identifica para ayudar a su reconocimiento

La verdad que esta web es de mucha mucha ayuda 😀

google font api por fin podemos usar en html cualquier tipo de fuente o tipografia

Gracias a google se acabo usar siempre para tus desarrollos web las tipografias estandar que vienen instaladas en el sistema operativo de tu pc

En Google Font Directory podemos visualizar todas las fuentes disponibles

Implementar una tipografía de Google Web Fonts en nuestra página web

Una vez seleccionada la tipo que quieres, para configurarla en tu páginas web, Google nos ofrece tres formas distintas:

1. Stantdar: A través de la etiqueta Link, como cualquier otro estilo css, (dentro de las etiquetas head de la página web).

<link href="http://fonts.googleapis.com/css?family=Fuentes+Escogidas+Google" rel='stylesheet' type='text/css'>

2. @import: Haciendo un include de la fuente directamente en el archivo de estilos css (ejemplo style.css).

@import url(http://fonts.googleapis.com/css?family=Fuentes+Escogidas+Google);

3. Javascript: A través de un script de javascript (dentro las etiquetas head de la página web).

<script type="text/javascript"><!--
  WebFontConfig = {
    google: { families: [ &prime;Fuentes+Escogidas+Google&prime; ] }
  };
  (function() {
    var wf = document.createElement(&prime;script&prime;);
    wf.src = (&prime;https:&prime; == document.location.protocol ? &prime;https&prime; : &prime;http&prime;) +
      &prime;://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js&prime;;
    wf.type = &prime;text/javascript&prime;;
    wf.async = &prime;true&prime;;
    var s = document.getElementsByTagName(&prime;script&prime;)[0];
    s.parentNode.insertBefore(wf, s);
  })();
// --></script>

Para usar la fuente o tipografía seleccionada e implementada, solamente hay que indicarlo en la propiedad Font-family:

h1 { font-family: 'Metrophobic', Arial, serif; font-weight: 400; }