Reemplaza Lorem Ipsum por algo más moderno

Introducción

Lorem ipsum es un texto bien conocido entre los que nos dedicamos a la programación o al diseño, apareciendo continuamente en todo tipo de proyectos. El texto en sí no tiene ningún sentido puesto que sólo son palabras sueltas e incompletas de una obra escrita hace más de 2000 años por Cicerón, titulada "De finibus bonorum et malorum". Este extracto de texto lleva usándose más de 500 años a modo de relleno, para preparar bocetos y prototipos que aún no cuentan con contenido real.

La cuestión es que cuando alguien ajeno a este mundillo lee ese texto, pensará que nos estamos volviendo locos. Así pues, alguien decidió crear una tipografía llamada BLOKK, que más tarde Christian Maths forkearía para liberarla bajo una licencia open source. Esta tipografía se llama Redacted y posee dos variantes: Regular y Script (ésta además incluye variantes Script Bold y Script Light).

Se trata de una tipografía que convertirá cualquier carácter en un garabato o bloque.

La tipografía se distribuye en varios formatos como .eot, .woff, .ttf y .svg para utilizarla de manera local. También se puede encontrar en plataformas como Google Fonts.

Demo y descarga

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Redacted|Redacted+Script">

<div class="wrapper">
  <div>
    <div>I Guess You Guys Aren't Ready For That Yet. But Your Kids Are Gonna Love It.</div>
    <div>Oct. 21, 2015</div>
  </div>
  <div>
    <div>I Guess You Guys Aren't Ready For That Yet. But Your Kids Are Gonna Love It.</div>
    <div>Oct. 21, 2015</div>
  </div>
</div>

@import url("https://fonts.googleapis.com/css?family=Redacted|Redacted+Script");

.wrapper > div:first-child {
  font-family: "Redacted";
}

.wrapper > div:last-child {
  font-family: "Redacted Script";
}

/* Estilos de la demo */

.wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.wrapper > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  border: 5px solid var(--color-primary);
  border-radius: 4px;
  background-color: var(--color-background);
  padding: 12px;
  color: var(--color-opposite);
  gap: 12px;
}

Se puede descargar desde https://github.com/christiannaths/Redacted-Font.