All credit to Los Gordos at BlokkFont

This Repo exists because the certificate at the official site has expired, and https links no longer get served securely. This makes it impossible to use the font in CodePen, as they have recently switched from HTTP/HTTPS to HTTPS.

Usage

Include it in your project

you can use either blokkfont.css for the rawgit links or use blokkfont_original.css for including the font straight from BlokkFont, the base URL is the same. Be aware that blokkfont_original.css does not serve as HTTPS.

<link href="https://gitcdn.xyz/repo/octoshrimpy/blokkfont/master/blokkfont.css" rel="stylesheet" type="text/css">

<link href="https://gitcdn.xyz/repo/octoshrimpy/blokkfont/master/blokkfont_original.css" rel="stylesheet" type="text/css">

@import url("https://gitcdn.xyz/repo/octoshrimpy/blokkfont/master/blokkfont.css");

@import url("https://gitcdn.xyz/repo/octoshrimpy/blokkfont/master/blokkfont_original.css");

Use it!

font-family: "BLOKK";

You can also use the .is-blokk class modifier to selectively turn specific elements and their children into BLOKK text.

Bookmarklet!

Need to easily inject it into whatever site you're on? Use a bookmarklet! Just drag the link below onto your bookmark bar. Github doesn't allow bookmarklet urls, so head to your favorite bookmarklet creator, like https://mrcoles.com/bookmarklet/ and enter the following code:

let link = document.createElement('link');
link.href = 'https://gitcdn.xyz/repo/octoshrimpy/blokkfont/master/blokkfont.css'; 
link.rel = 'stylesheet';
link.type = 'text/css';
document.head.appendChild(link);

let style = document.createElement('style');
document.head.appendChild(style);
style.sheet.insertRule('.blokked, .redacted { font-family: BLOKK; color: grey; }');

Then click the bookmarklet to inject it into the site with css classes of .blokked and .redacted. Then add the class to whatever you need to redact. It's great for screenshots!

Download it from BlokkFont

Download or go to official download page (scroll down a bit)