Skip to content

Instantly share code, notes, and snippets.

@primaryobjects
primaryobjects / css-comparison.csv
Last active April 11, 2025 19:11
A comparison of CSS library sizes.
Name Version Size (uncompressed) Size (minified) Size (gzipped) URL
Bootstrap v3.3.7 143 KB 117 KB 20 KB http://getbootstrap.com/css/
Bootstrap v4.0.0 187 KB 147 KB 20 KB https://v4-alpha.getbootstrap.com/
Materialize v3.0 114 KB 90 KB 18 KB http://materializecss.com/
Material Design Lite v1.3.0 350 KB 137 KB 21 KB https://getmdl.io/
mini.css v2.1 47 KB 36 KB 7 KB https://chalarangelo.github.io/mini.css/
Semantic UI v2.2.6 730 KB 550 KB 95 KB https://semantic-ui.com/
Foundation v3.0 90 KB 64 KB 12 KB http://foundation.zurb.com/
Pure CSS v0.6.2 80 KB 17 KB 3.8 KB https://purecss.io/
Picnic CSS v6.3.2 55 KB 38 KB 7 KB https://picnicss.com
@stramel
stramel / css-var-polyfill.js
Created September 6, 2016 21:48
CSS Variable Polyfill
/*
TODO:
X Maybe account for defaults: color: var(--header-color, blue);
- Verify cross domain working or not (it is working from dropbox)
- Option to wait to apply anything until all <link>s are parsed or inject what we have and update as each <link> returns
- Need to test on a more complex CSS file
- Option to save parsed file in local/session storage so there isn't a delay on additional page loads. Could only do it for links (with URLs to use as keys) and style blocks with IDs of some sort
- Need to test more complex values like rgba(255,0,0,0.5); and something with !important
- Try multiple links
- Local links
# Choices
color :
white : &color-white "#FFFFFF"
black : &color-black "#262626"
neutral :
20 : &color-neutral-20 "#222222"
90 : &color-neutral-90 "#EEEEEE"
blue:
50: &color-blue-50 "#2196F3"
@hsleonis
hsleonis / better-font-smoothing.css
Last active January 12, 2025 12:26
Better font smoothing in cross browser
html {
/* Adjust font size */
font-size: 100%;
-webkit-text-size-adjust: 100%;
/* Font varient */
font-variant-ligatures: none;
-webkit-font-variant-ligatures: none;
/* Smoothing */
text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
@milanaryal
milanaryal / schema-org-structured-data-markup-using-microdata.html
Last active March 23, 2025 04:33
An example of how to mark up a HTML5 webpage using the schema.org schemas and microdata.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Site Title</title>
<link rel="stylesheet" href="/assets/css/style.min.css">
@jonlabelle
jonlabelle / string-utils.js
Last active December 15, 2024 21:36
Useful collection of JavaScript string utilities.
// String utils
//
// resources:
// -- mout, https://github.com/mout/mout/tree/master/src/string
/**
* "Safer" String.toLowerCase()
*/
function lowerCase(str) {
return str.toLowerCase();
@kevinSuttle
kevinSuttle / meta-tags.md
Last active April 9, 2025 13:51 — forked from lancejpollard/meta-tags.md
List of Usable HTML Meta and Link Tags