Descarga Overused Grotesk - Descargar el código fuente Overused Grotesk

Overused Grotesk

Descarga de fuentes

v0.5-alpha.1

Descargar

Grotesk en exceso

Desde una burla tonta del diseño de tipo "suizo" en exceso hasta un caballo de batalla semi-serioso, Grotesk en exceso se convierte en un imitador al imitar las características más distintivas de la ubicua Helvetica. Sin embargo, el tipo de letra no se detiene en ser un imitador; Quiere ser multilingüe y multilingüe, aunque peculiar y inonestable.

Este tipo de letra se sirvió originalmente como una forma de "exposición" para usuarios ajenos de Fontforge. Desafortunadamente, debido al desarrollo magníficamente rápido, junto con el mal flujo de trabajo y la mala gestión, el proyecto rápidamente se volvió incomprensible para un principiante absoluto. Sooo oopsies

Las fuentes son gratuitas y de código abierto, y cualquier contribución sería muy apreciada. Si planea mostrar esta letra a alguien o enviarla a una colección de fuentes, recuerde vincular este repositorio . No es obligatorio, pero ahorra muchos dolores de cabeza (créeme).

Grotesk en exceso

Estilos

Nombre de estilo	wght	wdth	-	Nombre de estilo	wght	wdth	slnt
Luz	300	100	-	Ligera en cursiva	300	100	-10
Libro	350	100	-	Cursiva de libros	350	100	-10
romano	400	100	-	Itálico	400	100	-10
Medio	500	100	-	Cursiva media	500	100	-10
Semibold	600	100	-	Cursiva semibold	600	100	-10
Atrevido	700	100	-	Cursiva audaz	700	100	-10
Extraborado	800	100	-	Cursiva extrabold	800	100	-10
Negro	900	100	-	Cursiva negra	900	100	-10

Características y adiciones notables

Incluye letras vietnamitas y cirílicas (con formularios localizados)
12 conjuntos estilísticos + 5 variantes de caracteres
Sub & Superscript, denominadores y numeradores, cero cero, figuras tabulares, anotaciones matemáticas, fracciones
.ttf, .otf, .woff, .woff2 y variables .ttf fuentes
Letras de IPA (diacríticos y letras de tono semifuncionales, aún muy básicas)
Símbolos de divisas: $ ¢ £ ¤ ¥ ֏฿₠₡₢₣₤₥₦₧₨₩₪₫ € ₭₮₯₰₱₲₳₴₵₶₷₸ ₹ ₺₻₼₽₾₿
Flechas (demasiado de ellas, 84 para ser exactos)
Ligaduras discrecionales similares a script (FI, FF, FL, FFI, FFL)

Planes

Después de v1.0 - antes de v2.0

Más anchos (5 anchos estáticos: comprimido - condensado - normal - extendido - ancho)
Griego
Versalitas
Construyendo letras más acentuadas (específicas de latín)

⏳ En progreso

Sintonia FINA
Cursiva de acabado

Fuentes variables para la web

Tanto la fuente como la carpeta de lanzamiento incluyen una fuente variable .woff2, que puede incluir en su sitio web y consulte el uso de CSS al incluir algo en la línea de:

base.css

 : root {
    --font-sans : "Overused Grotesk" , -apple-system , BlinkMacSystemFont , "Segoe UI" , "Roboto" , "Oxygen" , "Ubuntu" , "Cantarell" , "Fira Sans" , "Droid Sans" , "Helvetica Neue" , sans-serif;
    --font-serif : Georgia , Times , serif;
    --font-mono : Menlo , Courier , monospace;
}

@font-face {
  font-family : "Overused Grotesk" ;
  src :
    url ( "../fonts/OverusedGrotesk-VF.woff2" ) format ( "woff2 supports variations" ) ,
    url ( "../fonts/OverusedGrotesk-VF.woff2" ) format ( "woff2-variations" );
  font-weight : 300 900 ;
}

Para reducir el desplazamiento acumulativo de diseño, puede precargar la fuente y usar el observador de la cara de fuente para mostrar la fuente son luminamente rápido.

base.html

 <!DOCTYPE html >
< html lang =" en " >
  < head >
    < title > Static HTML is King ? </ title >
    < meta charset =" UTF-8 " >
    < meta name =" viewport " content =" width=device-width " >
    < link rel =" stylesheet " href =" /css/base.css " >
    < link rel =" preload " href =" /fonts/OverusedGrotesk-VF.woff2 " as =" font " type =" font/woff2 " crossorigin >
  </ head >
  < body >

    < main >
      < h1 > Static HTML is King ? </ h1 >
    </ main >
 
    <!--
    https://fontfaceobserver.com/
    To load a font, call the load method on a FontFaceObserver instance.
    It’ll return a promise that resolves when the font loads, or rejected when the font fails to load.
    -->
   < script src =" /js/fontfaceobserver.js " > </ script >
   < script >
   var font = new FontFaceObserver ( 'Overused Grotesk' ) ;

   font . load ( ) . then ( function ( ) {
     console . log ( 'Overused Grotesk has loaded.' ) ;
   } ) . catch ( function ( ) {
     console . log ( 'Overused Grotesk failed to load.' ) ;
   } ) ;
   </ script >

  </ body >
</ html >