HTML CSS

Open-source HTML projects categorized as CSS

Top 23 HTML CSS Projects

  • tabler

    Tabler is free and open-source HTML Dashboard UI Kit built on Bootstrap

    Project mention: Top 20 Best React Website Templates for React Developers [Free and Premium] | dev.to | 2022-08-23

    Demo

  • simplefolio

    ⚡️ A minimal portfolio template for Developers

    Project mention: Make An Impressive Portfolio Site 😎️ | dev.to | 2022-03-07

    2.3 — Simplefolio

  • Zigi

    Delete the most useless function ever: context switching.. Zigi monitors Jira and GitHub updates, pings you when PRs need approval and lets you take fast actions - all directly from Slack! Plus it reduces cycle time by up to 75%.

  • CoreUI-Free-Bootstrap-Admin-Template

    Free Bootstrap Admin & Dashboard Template

    Project mention: How long should a fullstack dev take to build this webapp? | reddit.com/r/webdev | 2022-08-21

    I've got a similar amount of experience, and could set this up in a few hours using Laravel and CoreUI for the UI.

  • Tailwind-Elements

    𝙃𝙪𝙜𝙚 collection of Tailwind components, sections and templates 😎 - FREE for commercial use

    Project mention: Affordable tailwind theme(html template) for e-commerce project | reddit.com/r/tailwindcss | 2022-11-03
  • Milligram

    A minimalist CSS framework.

    Project mention: What is the best way to develop a frontend using only HTML, CSS, Bootrap, JS w/o frameworks? | reddit.com/r/webdev | 2022-11-21

    If you do want to use a framework and get up and running quickly, but you still want to know what's going on and have some ability to customize it, maybe you can start with one of the really minimal CSS frameworks like Milligram or Sakura and then add your own modifications.

  • Charts.css

    Open source CSS framework for data visualization.

  • Tufte CSS

    Style your webpage like Edward Tufte’s handouts.

    Project mention: The Limits and “Good” of Public Goods | news.ycombinator.com | 2022-10-27

    I think this doesn't work well even if you have a really large screen. It's doing a style somewhat like https://edwardtufte.github.io/tufte-css/ but doesn't scale the content to be sure it can fit on the screen, nor center it without having to scroll for sidenotes.

    Just in case the author sees: with the way the sidenotes are specified relative to the parent, this is [probably] better:

    @media (min-width:760px) {

  • InfluxDB

    Build time-series-based applications quickly and at scale.. InfluxDB is the Time Series Data Platform where developers build real-time applications for analytics, IoT and cloud-native services in less time with less code.

  • HyperUI

    HyperUI is a large collection of free Tailwind CSS components for marketing, ecommerce and application UI 🐳

    Project mention: [Announcement] Maglev, an open source page builder | reddit.com/r/rails | 2022-10-11

    About Bulma & Bootstrap or any HTML/CSS frameworks, you are free to use anything you want within Maglev. Because I didn't have time to design/integrate the sections myself, I relied on an open source library of Taildwincss components (https://hyperui.dev).

  • suit

    Style tools for UI components

    Project mention: Front-end Guide | dev.to | 2022-11-23

    CSS (Cascading Style Sheets) are rules to describe how your HTML elements look. Writing good CSS is hard. It usually takes many years of experience and frustration of shooting yourself in the foot before one is able to write maintainable and scalable CSS. CSS, having a global namespace, is fundamentally designed for web documents, and not really for web apps that favor a components architecture. Hence, experienced front end developers have designed methodologies to guide people on how to write organized CSS for complex projects, such as using SMACSS, BEM, SUIT CSS, etc.

  • pattern.css

    CSS only library to fill empty background with beautiful patterns.

    Project mention: 16 Useful Background Generators for Your Website Designs 🎨😍 | dev.to | 2022-05-19

    16. pattern-css

  • bulma-templates

    free flexbox templates built with the bulma css framework

    Project mention: Ask HN: How to build online calculator website? | news.ycombinator.com | 2022-11-19

    I use a simple serverside framework such as ExpressJS or FlaskJS, which routes URL requests to HTML page responses.

    Served by NGINX on a Linux server. I host with DigitalOcean for $6/month

    I use a CSS Framework template. I like Bulma for its simplicity: https://bulmatemplates.github.io/bulma-templates/

    Summary of things to google:

    - simple Serverside framework for

    - Digital ocean nginx tutorial

    - CSS Framework Template

  • simple.css

    Simple.css is a classless CSS template that allows you to make a good looking website really quickly.

    Project mention: Show HN: Bolt.css – Another classless CSS library | news.ycombinator.com | 2022-10-24
  • hugo-theme-stack

    Card-style Hugo theme designed for bloggers

    Project mention: Best place for an rpg blog. | reddit.com/r/rpg | 2022-10-03

    I use the Hugo Theme Stack: https://github.com/CaiJimmy/hugo-theme-stack

  • open-props

    CSS custom properties to help accelerate adaptive and consistent design.

    Project mention: What working with Tailwind CSS every day for 2 years looks like | news.ycombinator.com | 2022-11-29

    You could combine styled-components/emotion with something like open-props[0]. You get all the power that comes with CSS and a set of variables to help you create a consistent design. That's how I manage my styling.

    [0] https://open-props.style

  • penthouse

    Generate critical css for your web pages

    Project mention: Critical CSS? Not So Fast | news.ycombinator.com | 2022-09-10

    It is easy with a little automation :). In the build process, adding a step to calculate critical path css helps. This should probably be the last step and run on production post deploy. The calculated CSS is stored in redis which will be appended in the head for subsequent requests. This tool had inspired me to build this process at multiple orgs I have worked with https://github.com/pocketjoso/penthouse.

    Agree on the async JS part but I guess browser makers will solve it soon.

  • latex-css

    LaTeX.css is a CSS library that makes your website look like a LaTeX document

    Project mention: Show HN: Bolt.css – Another classless CSS library | news.ycombinator.com | 2022-10-24
  • Dopefolio

    Dopefolio 🔥 - Portfolio Template for Developers 🚀

    Project mention: I Created An Open-Source Portfolio Template For Developers 🔥 | dev.to | 2022-07-15

    Demo Link 🔗

  • dropcss

    An exceptionally fast, thorough and tiny unused-CSS cleaner

    Project mention: Parcel CSS: A new CSS parser, compiler, and minifier | news.ycombinator.com | 2022-01-12
  • Sanitize

    Ruby HTML and CSS sanitizer.

  • awesome-portfolio-websites

    A community maintained open source project aimed at making a personal portfolio for researchers, developers, and analysts simple, fast, and less cumbersome. We make sure you have a full-fledged website to showcase your work while you can spend time on your learning and innovative endeavors. (by smaranjitghose)

  • resume-template

    :page_facing_up::briefcase::tophat: A simple Jekyll + GitHub Pages powered resume template. (by jglovier)

  • pushy

    Pushy is a responsive off-canvas navigation menu using CSS transforms & transitions.

    Project mention: I have been trying to figure out what this website layout is for years. It was really popular with photographers and I finally found a site with it! What is it?! | reddit.com/r/NoStupidQuestions | 2022-02-19

    That one specifically is the Pushy Menu, just going by what I can see in the source. If you don't need it with the Responsive Design thing, you can do something similar with a couple of frames, like on stfj.net. Sorry I can't help further. I know what you're talking about, I've seen other websites with that exact same sort of menu layout and aesthetic, but I don't think that's because there's a maker for them, just because it's a sort of design a lot of artists tend towards using...

  • simple-html-invoice-template

    A modern, clean, and very simple responsive HTML invoice template

    Project mention: Generate PDFs from HTML via Puppeteer on AWS Lambda + API Gateway | dev.to | 2022-04-24

    To test this code, an HTML template is needed. We will use this open-source one for demonstration. The document is being sent as body with 'Content-Type: text/html'

  • Scout APM

    Truly a developer’s best friend. Scout APM is great for developers who want to find and fix performance issues in their applications. With Scout, we'll take care of the bugs so you can focus on building great things 🚀.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2022-11-29.

HTML CSS related posts

Index

What are some of the best open-source CSS projects in HTML? This list will help you:

Project Stars
1 tabler 32,119
2 simplefolio 11,619
3 CoreUI-Free-Bootstrap-Admin-Template 11,451
4 Tailwind-Elements 9,938
5 Milligram 9,852
6 Charts.css 5,626
7 Tufte CSS 5,226
8 HyperUI 3,889
9 suit 3,782
10 pattern.css 3,672
11 bulma-templates 3,067
12 simple.css 3,014
13 hugo-theme-stack 2,792
14 open-props 2,738
15 penthouse 2,552
16 latex-css 2,431
17 Dopefolio 2,247
18 dropcss 2,117
19 Sanitize 1,970
20 awesome-portfolio-websites 1,707
21 resume-template 1,551
22 pushy 1,483
23 simple-html-invoice-template 1,324
Static code analysis for 29 languages.
Your projects are multi-language. So is SonarQube analysis. Find Bugs, Vulnerabilities, Security Hotspots, and Code Smells so you can release quality code every time. Get started analyzing your projects today for free.
www.sonarqube.org