Skip to content

Instantly share code, notes, and snippets.

@shqld
Forked from primaryobjects/css-comparison.csv
Last active October 3, 2022 21:13
Show Gist options
  • Star 17 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save shqld/53149f99f164a507aff8e37403d705f7 to your computer and use it in GitHub Desktop.
Save shqld/53149f99f164a507aff8e37403d705f7 to your computer and use it in GitHub Desktop.
A comparison of CSS library sizes.
Caution Name Version Size (raw) Size (minified) Size (gzipped) Site URL Remarks
Milligram v1.4.1 11 kb 9.0 kb 2.3 kb https://milligram.io/ https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.min.css
Skelton v2.0.4 11 kb 5.8 kb 1.6 kb http://getskeleton.com/ https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css
Material Design Lite v1.3.0 146 kb 62 kb 12 kb https://getmdl.io/ https://code.getmdl.io/1.3.0/material.min.js
Foundation v6.6.3 168 kb 133 kb 17 kb https://get.foundation/ https://cdn.jsdelivr.net/npm/foundation-sites@6.6.3/dist/css/foundation.min.css
Materialize v1.0.0 179 kb 141 kb 21 kb https://materializecss.com/ https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css
Bootstrap v4.6.0 199 kb 161 kb 24 kb https://getbootstrap.com/docs/4.6/ https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css
Bootstrap v5.1.2 206 kb 164 kb 24 kb https://getbootstrap.com/ https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css
Bootstrap v5.2.0-beta1 237.6 kb 193.5 kb 26.3 kb https://getbootstrap.com/ https://github.com/twbs/bootstrap/releases/download/v5.2.0-beta1/bootstrap-5.2.0-beta1-dist.zip
Bulma v0.9.3 245 kb 207 kb 28 kb https://bulma.io/ https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css
Pure CSS v2.0.6 29 kb 17 kb 4.8 kb https://purecss.io/ https://unpkg.com/purecss@2.0.6/build/pure-min.css
UIKit v3.7.5 357 kb 137 kb 43 kb https://getuikit.com/ https://cdn.jsdelivr.net/npm/uikit@3.7.5/dist/js/uikit.min.js
mini.css v3.0.1 55 kb 47 kb 9.7 kb https://minicss.org/ https://cdn.rawgit.com/Chalarangelo/mini.css/v3.0.1/dist/mini-default.min.css
Picnic CSS v6.3.2 57 kb 39 kb 7 kb https://picnicss.com https://cdn.jsdelivr.net/npm/picnic@6.5.5/picnic.min.css
Primer CSS v17.11.0 608 kb https://primer.style/css/ https://unpkg.com/@primer/css@17.11.0/dist/primer.css No minified modules are served
Spectre v0.5.9 62 kb 47 kb 14 kb https://picturepan2.github.io/spectre/ https://unpkg.com/spectre.css@0.5.9/dist/spectre.min.css
new.css v1.1.2 7.1 kb 4.8 kb 1.8 kb https://newcss.net/ https://cdn.jsdelivr.net/npm/@exampledev/new.css@1.1.2/new.min.css
Semantic UI v2.4.1 736 kb 275 kb 71 kb https://semantic-ui.com/ https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js
MVP.css v1.8.0 8.6 kb https://andybrewer.github.io/mvp/ https://unpkg.com/mvp.css@1.8.0/mvp.css No minified modules are served
* Base v5.2.0 0.2 b 0.1 b https://getbase.org/ https://unpkg.com/@getbase/base@5.2.0/core.css Has plugin system, the core module does almost nothing, all served modules are minified
@shqld
Copy link
Author

shqld commented Oct 7, 2021

NOTE:

  • CSS only
  • No customization, directly via CDN by curl
  • Core module only, no attachments nor normalize.css
  • Tested with fetch.sh
  • Size are checked by exa -l

Testing script

#! /usr/sh

name="$1"
raw_url="$2"
min_url="$3"

curl "$raw_url" -f > "$name.raw"
curl "$min_url" -f > "$name.min"
curl "$min_url" -f -H accept-encoding:gzip > "$name.min.gz"

ls -l "$name.raw" "$name.min" "$name.min.gz"

@shqld
Copy link
Author

shqld commented Oct 7, 2021

Testing history
sh fetch.sh bulma https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.css https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css
sh fetch.sh spectre https://unpkg.com/spectre.css@0.5.9/dist/spectre.css https://unpkg.com/spectre.css@0.5.9/dist/spectre.min.css
sh fetch.sh uikit https://cdn.jsdelivr.net/npm/uikit@3.7.5/dist/js/uikit.js https://cdn.jsdelivr.net/npm/uikit@3.7.5/dist/js/uikit.min.js
sh fetch.sh bootstrap5 https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.css https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css
sh fetch.sh bootstrap4 https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.css https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css
sh fetch.sh bootstrap3 https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.css https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.min.css
sh fetch.sh mini3 https://cdn.jsdelivr.net/gh/Chalarangelo/mini.css@v3.0.1/dist/mini-default.css https://cdn.rawgit.com/Chalarangelo/mini.css/v3.0.1/dist/mini-default.min.css
sh fetch.sh foundation https://cdn.jsdelivr.net/npm/foundation-sites@6.6.3/dist/css/foundation.css https://cdn.jsdelivr.net/npm/foundation-sites@6.6.3/dist/css/foundation.min.css
sh fetch.sh materialize https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.css https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css
sh fetch.sh mdl https://code.getmdl.io/1.3.0/material.js https://code.getmdl.io/1.3.0/material.min.js
sh fetch.sh semantic https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.js https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js
sh fetch.sh picnic https://cdn.jsdelivr.net/npm/picnic@6.5.5/picnic.css https://cdn.jsdelivr.net/npm/picnic@6.5.5/picnic.min.css
sh fetch.sh skelton https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.css https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css
sh fetch.sh primer https://unpkg.com/@primer/css@17.11.0/dist/primer.css ''
sh fetch.sh mvp https://unpkg.com/mvp.css@1.8.0/mvp.css ''
sh fetch.sh base '' https://unpkg.com/@getbase/base@5.2.0/core.css

@EricCote
Copy link

EricCote commented Oct 9, 2021

Could you add Tailwind CSS? Thanks!

@shaddamalbz
Copy link

how about Ant Design, could you add it? Thanks!

@baryluk
Copy link

baryluk commented May 13, 2022

bootstrap | 5.2.0-beta1 | 237.6 kB | 193.5 kB | 26.3kiB | https://github.com/twbs/bootstrap/releases/download/v5.2.0-beta1/bootstrap-5.2.0-beta1-dist.zip

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment