Snippets

These snippets are my attempt to save and organize various bits of code, best practices, and resources relating to web development and design. They also function as a to do list of sorts, for things I want to implement in my own code, but haven't yet. The concept is inspired by Jeremy Keith's links and CSS-Tricks, among other things. Enjoy.

Beyond The Mountains font face

Image

Hello, and thank you for downloading this font.

This font is free for PERSONAL USE ONLY!

But if you want to get a commercial license, it’s available at: http://www.stereo-type.fr
The commercial version contains a huge set of alternate glyphes and a wide range ligatures and swashes to create your own style ! You’ll be also able to edit PDF files with the font embedded.

This font is inspired by the work of Sean Delloro and with his authorization.
You can have a look at his Instagram page : https://www.instagram.com/seandllr/

I made it with love, so I hope you’ll love to use it !

Clement | StereoType

Mozilla's Readability.js

A standalone version of the readability library used for Firefox Reader View.

[…]

To parse a document, you must create a new Readability object from a document object, and then call parse(). Here’s an example:

var article = new Readability(document).parse();

This article object will contain the following properties:

  • title: article title
  • content: HTML string of processed article content
  • length: length of an article, in characters
  • excerpt: article description, or short excerpt from the content
  • byline: author metadata
  • dir: content direction

If you’re using Readability on the web, you will likely be able to use a document reference from elsewhere (e.g. fetched via XMLHttpRequest, in a same-origin <iframe> you have access to, etc.).

Splitting - text animation library

Image
A stylized "Splitting" with a banana mascot.
That's one determined banana.

Splitting creates elements and adds CSS variables to unlock amazing possibilities for animating text, grids, and more!

DoubleDash your CSS

The previously impractical becomes easy with Splitting’s CSS Variables.

Comically Small

A shocking amount of features in a 1.5kb (minified & gzipped) package.

Progressively Enhance

Upgrade websites for modern browsers without breaking IE.

Is Google Always Listening?

Jarvis Johnson explains that big companies like Google and Facebook don’t need to listen in on you via your phone/tablet, because they already collect so much data on you that they can guess what ads might be relevant on that alone. I love the critical thinking aspect to this - it’s easy to oversimplify complex systems, because our brains aren’t good at understanding that many variables, but reality is not required to bend to our beliefs.

Macbeth font face

Image

Macbeth is a unique new hand drawn OpenType SVG font from Giemons. This new font format allows for amazing authentic detail in each letter. This is an aggressive font with uppercase & lowercase characters as well as numbers, punctuation and a few extra marks. Use this for awesome displays, labeling, clothing, posters, movie titles, album covers, logos, and much more.

Note: SVG font formats are compatible with Photoshop CC 2017 or Illustrator CC 2018 + newer.

DOWNLOAD HERE
Free for personal & commercial use