• ref
  • You-Dont-Need-JavaScript
  • https://chokcoco.github.io/CSS-Inspiration/#/
  • https://github.com/search?o=desc&q=css+only&s=stars&type=Repositories
  • https://github.com/search?o=desc&q=pure+css&s=stars&type=Repositories
  • https://github.com/zhangyingwei/html-css-only
  • https://github.com/yyeexin/bilibili-html-demo
  • https://github.com/Zhangjd/awesome-pure-css-no-javascript
  • https://twitter.com/search?q=pure%20css%20icon&src=typed_query

popular

• https://github.com/bansal-io/pattern.css

  • https://bansal.io/pattern-css#cross-dots
  • CSS only library to fill empty background with beautiful patterns.

• https://github.com/asciimoo/cssplot

  • Simple, css-only plotting.

• https://github.com/css-doodle/css-doodle

  • https://css-doodle.com/
  • A web component for drawing patterns with CSS.

• https://github.com/css-doodle/shapes

  • https://css-doodle.com/shapes/?#collection
  • A tool for discovering new CSS polygon shapes generated with css-doodle @shape function and mathematical expressions.
  • The shape is defined with polar equations or cartesian equations.

• https://github.com/saeedalipoor/icono

  • One tag One icon, no font or svg, Pure CSS

• https://github.com/astrit/css.gg

  • 700+ Pure CSS, SVG & Figma UI Icons Available in SVG Sprite, styled-components, NPM & API

• https://github.com/colorswall/CSS-file-icons

  • Pure CSS icons for popular file extensions

• https://github.com/astrit/css.gg

  • https://css.gg/
  • 700+ Pure CSS, SVG & Figma UI Icons

• https://github.com/ConnorAtherton/loaders.css

  • https://connoratherton.com/loaders
  • A collection of loading animations written entirely in css.

• https://github.com/raphaelfabeni/css-loader

  • http://raphaelfabeni.github.io/css-loader
  • loaders for your web applications using only one div and pure CSS

• https://github.com/zalog/placeholder-loading

  • https://zalog.ro/placeholder-loading/
  • flexible, css only, content placeholder loading animation. 骨架屏

• https://github.com/maxbeier/text-spinners

  • https://maxbeier.github.io/text-spinners/
  • Pure text, CSS only, font independent, inline loading indicators

• https://github.com/drublic/css-modal

  • A modal built with pure CSS, enhanced with JavaScript

• https://github.com/lokesh-coder/pretty-checkbox

  • A pure CSS library to beautify checkbox and radio buttons.

• https://github.com/andriussev/timelined

  • A customizable CSS-only vertical timeline

css-tools

• https://github.com/1000ch/grd

  • A CSS grid framework using Flexbox. Only 321 bytes (Gzipped).

• https://github.com/jh3y/driveway

  • pure CSS masonry layouts

• https://github.com/mac81/pure-drawer

  • Pure CSS transition effects for off-canvas views

• https://github.com/kazzkiq/balloon.css

  • Simple tooltips made of pure CSS

• https://github.com/chinchang/hint.css

  • A CSS only tooltip library for your lovely websites.

• https://github.com/anydigital/float-label-css

  • https://codepen.io/tonystar/pen/JRLaKw
  • Bulletproof CSS-only implementation of Float Label pattern with automatic fallback for ANY non-supporting browser.

• devices.css

  • https://github.com/marvelapp/devices.css /3.4kStar/2017
    • http://marvelapp.github.io/devices.css/
  • https://github.com/picturepan2/devices.css /1.9kStar/2018
    • https://picturepan2.github.io/devices.css/

css-examples

• https://github.com/javierbyte/img2css
  • I also made a per-pixel animation experiment, see morphin.
  • Convert any image to pure CSS.
  • Recreates images using only box-shadows.
  • I also made a per-pixel animation experiment, see morphin.
• https://github.com/itmeo/webgradients
  • https://webgradients.com/
  • A curated collection of splendid gradients made in CSS3, .sketch and . PSD formats.

css-resources

• Open-Source UI elements - made with CSS and HTML

more-css

• https://github.com/lynnandtonic/a-single-div

  • a fun, little project to see how much can be accomplished with CSS.
  • Every drawing consists of a single HTML element (in this case, the beloved div).

• https://github.com/pixelastic/css-flags

  • Flags of the world with only one div

• https://github.com/bchanx/logos-in-pure-css

  • Company logos created in pure CSS.

• https://github.com/primefaces/primeui

  • PrimeUI is a collection of rich javascript widgets based on jQuery UI.

• https://github.com/raphaelfabeni/ui-interactions

  • https://raphaelfabeni.com/ui-interactions/
  • Ready-to-use UI interactions using only one element and pure CSS

• https://github.com/webondevices/html-css-wizardry

  • example projects from my book: All you need is HTML and CSS