# CSS Resources ### CSS Frameworks > CSS/UI frameworks to help build great looking websites and applications | Website | Description | | ---------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [Tailwind CSS](https://tailwindcss.com/) | Low level, utility-first framework | | [Bootstrap](https://getbootstrap.com/) | Popular UI framework with tons of components that use both CSS and JS | | [Materialize](https://materializecss.com/) | A modern responsive front-end framework based on Material Design | | [Material Design Lite](https://getmdl.io/) | Light framework based on Material Design. No JS dependency | | [Bulma](https://bulma.io/) | Modern CSS framework with no JS | | [Skeleton](http://getskeleton.com/) | Extremely light framework for basic UI elements | | [Uniform CSS](https://uniformcss.com/) | Fully configurable utility generator and CSS framework built entirely in Sass | | [Semantic UI](https://semantic-ui.com/) | Empowers designers and developers by creating a shared vocabulary for UI | | [Fomantic UI](https://fomantic-ui.com/) | A community fork of Semantic-UI | | [Foundation](https://get.foundation/) | Mobile first framework with clean markup | | [Pure CSS](https://purecss.io/) | A set of small, responsive CSS modules | | [UIKit](https://getuikit.com/) | Lightweight and modular front-end framework | | [Susy](https://www.oddbird.net/susy/) | Lightweight, grid-layout engine for Sass | | [Milligram.io](https://milligram.io/) | Minimalist CSS framework | | [Vanilla Framework](https://vanillaframework.io/) | Simple, extensible CSS framework written in Sass | | [Spectre CSS](https://picturepan2.github.io/spectre/) | Lightweight, modern CSS framework | | [Picnic CSS](https://picnicss.com/) | Lightweight and beautiful library | | [Wing](https://kbrsh.github.io/wing/) | A beautiful CSS framework designed for minimalists | | [Chota](https://jenil.github.io/chota/) | A micro (\~3kb) CSS framework | | [Blueprint CSS](https://blueprintcss.dev/) | A lightweight layout library for building great responsive mobile first UIs that work everywhere | | [W3.CSS](https://www.w3schools.com/w3css/) | A modern CSS framework with support for desktop, tablet, and mobile design by default. Designed to be independent of jQuery or any other JavaScript library | | [98.css](https://jdan.github.io/98.css/) | A design system for building faithful recreations of old UIs | | [NES CSS](https://nostalgic-css.github.io/NES.css/) | NES-style CSS Framework | | [Shoelace.css](https://www.shoelace.style/) | Lightweight, forward-thinking CSS library built with future CSS syntax | | [MVP.css](https://andybrewer.github.io/mvp/) | A minimalist stylesheet for HTML elements. No class names, no frameworks, just semantic HTML and you're done | | [Blaze.css](http://blazecss.com/) | Open source modular CSS toolkit providing great structure for building websites quickly | | [Turret CSS](https://turretcss.com/) | Turret CSS is a styles framework for development of responsive websites. | | [Cutestrap](https://www.cutestrap.com/) | A strong, independent CSS Framework. | | [Shorthand](https://shorthandcss.com/) | Shorthand is a free and open source css framework, that allows you to make unique and modern design without writing any css | | [XP.css](https://botoxparty.github.io/XP.css/) | XP.css is an extension of 98.css. A CSS library for building interfaces that look like old UIs. | | [Framework7](https://framework7.io/) | Framework7 - is a free and open source framework to develop mobile, desktop or web apps with native look and feel. | | [Hint.css](https://kushagra.dev/lab/hint/) | A pure CSS tooltip library for your lovely websites. | | [imagehover.io](http://imagehover.io/) | Pure CSS Image Hover Effect Library | | [mini.css](https://minicss.org/) | A minimal, responsive, style-agnostic CSS framework | | [Tachyons](https://tachyons.io/) | Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible. | | [Material Bootstrap](https://fezvrasta.github.io/bootstrap-material-design/) | Material Design with Bootstrap | | [Ivory](https://github.com/IVORY-UI/ivory) | A modern CSS framework for developing powerful web interfaces faster and easier | | [Halfmoon UI](https://www.gethalfmoon.com/) | A responsive and lightweight framework, designed for quickly building beautiful dashboards and product pages. | | [Metro 4](https://metroui.org.ua/index.html) | Create your site quickly and effectively with Metro 4. impressive components library built on html, css, javascript. | | [css-doodle](https://css-doodle.com/) | A web component for drawing patterns with CSS | | [latex.css](https://latex.now.sh/) | Make your website look like a LaTeX document | | [Paper CSS](https://github.com/cognitom/paper-css) | Front-end printing solution | | [Windi CSS](https://windicss.org/) | Next generation compiler for Tailwind CSS | | [Cirrus CSS](https://cirrus-ui.netlify.app/) | A component and utility centric SCSS framework designed for rapid prototyping. | | [Gutenberg](https://github.com/BafS/Gutenberg) | Modern framework to print the web correctly.  | | [lit](https://github.com/ajusa/lit) | World's smallest responsive fire css framework (395 bytes).  | | [Arwes](https://github.com/arwes/arwes) | Arwes is a web framework to build user interfaces based on futuristic science fiction designs, animations, and sound effects.  | | [Bojler](https://bojler.slicejack.com/) | Bojler is an email framework for developing responsive and lightweight email templates that will render correctly across each of the most popular email clients.  | | [Tacit](https://github.com/yegor256/tacit) | Primitive CSS Framework for dummies, without classes.  | | [Terminal CSS](https://terminalcss.xyz/) | A modern and minimal CSS framework for terminal lovers.  | | [Sakura](https://oxal.org/projects/sakura/) | A minimal classless css framework / theme.  | | [PSone](https://github.com/micah5/PSone.css) | PS1 style CSS Framework, inspired by NES.css.  | | [Marx](https://github.com/mblode/marx) | Marx is the classless CSS reset to be used in any projects (namely small ones).  | | [Tufte](https://github.com/edwardtufte/tufte-css) | Style your webpage like Edward Tufte’s handouts.  | | [Axentix](https://useaxentix.com/) | Axentix is an open source Framework based on CSS Grid using HTML, CSS and JS. | | [Raster Simple Grid System](https://rsms.me/raster/) | Minimal and straight-forward CSS grid system utilizing descriptive HTML rather than semantic CSS. | ### CSS Methodologies > CSS methodologies to help write modular, reusable and scalable code | Website | Description | | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------- | | [OOCSS](http://oocss.org/) | OOCSS concepts help us write components that are flexible, modular and interchangeable. | | [Atomic CSS](https://acss.io/) | Atomic CSS is the approach to CSS architecture that favors small, single-purpose classes with names based on visual function. | | [BEM](http://getbem.com/) | Block Element Modifier is a methodology that helps you to create reusable components and code sharing in front-end development. | | [SMACSS](http://smacss.com/) | SMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process. | ### CSS Animations > CSS animations to build awesome animations for websites and applications | Website | Description | | -------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | [Animate.css](https://animate.style/) | Just-add-water CSS animations | | [Bounce.js](http://bouncejs.com/) | Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations | | [Anime.js](https://animejs.com/) | Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes and JavaScript Objects | | [Magic Animations](https://www.minimamente.com/project/magic/) | Animations has been one of the most impressive animation libraries available | | [Zdog](https://zzz.dog/) | Round, flat, designer-friendly pseudo-3D engine for canvas & SVG | | [CSShake](http://elrumordelaluz.github.io/csshake/) | CSShake delivers exactly what it says on the box — a CSS library designed specifically for shaking elements within your web page | | [Hover.css](http://ianlunn.github.io/Hover/) | Hover.css is a CSS animation library designed for use with buttons and other UI elements in your website | | [AniJS](http://anijs.github.io/) | AniJS is an animation library that allows you to add animations to elements in a simple ‘sentence-like’ structure | | [Animista](http://animista.net/) | CSS Animations On Demand | | [Tachyons-animate](https://github.com/anater/tachyons-animate) | Tachyons itself is an atomic CSS library with a ton of utility classes for essentially designing anything by adding classes to what you need | | [Sequence.js](https://www.sequencejs.com/) | Sequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications | | [Infinite](https://tilomitra.github.io/infinite/) | These animations, like rotations and pulses, that are specifically designed to run and repeat forever | | [OBNOXIOUS.CSS](http://tholman.com/obnoxious/) | Animations for the strong of heart, and weak of mind | | [MOTION UI](https://zurb.com/playground/motion-ui) | A Sass library for creating flexible CSS transitions and animations | | [Keyframes.app](https://keyframes.app/) | A graphical user interface for generating custom CSS keyframe animations | | [thoughtbot](https://thoughtbot.com/blog/transitions-and-transforms) | CSS Transitions and Transformations for Beginners | | [SVG Artista](https://svgartista.net/) | A useful tool to animate stroke and fill properties in SVG images with plain CSS code | | [AnimXYZ](https://animxyz.com/) | AnimXYZ helps you create, customize, and compose animations for your website. Built for Vue, React, SCSS, and CSS | | [Whirl](https://github.com/jh3y/whirl) | CSS loading animations with minimal effort! | | [Hamburgers](https://jonsuh.com/hamburgers/) | Hamburgers is a collection of tasty CSS-animated hamburger icons. Also included is the source as a Sass library. It’s modular and customizable, so cook up your own hamburger. | --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://devresources.gitbook.io/devresources/contents/css-resources.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.