Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

PostCSS

PostCSS is a tool for transforming CSS with JavaScript. It can be used to develop a template language such as Sass and LESS. The PostCSS core consists of:

CSS parser that generates an abstract syntax tree
Set of classes that comprises the tree
CSS generator that generates a CSS line for the object tree
Code map generator for the CSS changes made#

There are official tools making it possible to use PostCSS with build systems such as Webpack, Gulp, and Grunt. There is also a console interface available. Browserify or Webpack can be used to open PostCSS in a browser.

The complete plugin list can be found on postcss.parts, with some examples listed below.

Autoprefixer to add and clear browser prefixes.
CSS Modules to get CSS selectors isolated and code organized. It is supplied as part of Webpack.
stylelint to analyze CSS code for mistakes and check style consistency.
stylefmt fixes the CSS code according to the stylelint settings.
PreCSS to perform some Sass/Less preprocessing functions.
postcss-preset-env to emulate features from unfinished CSS specification drafts.
cssnano to make CSS smaller in size by getting rid of the spaces and rewriting the code.
RTLCSS to change CSS code so that the design should be suitable for right-to-left writing (such is applied in Arabic and Hebrew).
postcss-assets, postcss-inline-svg and postcss-sprites to work with graphics.

GitHub: https://github.com/topics/postcss
Wikipedia: https://en.wikipedia.org/wiki/PostCSS
Repo: https://github.com/postcss
Created by: Andrey Sitnik, Ben Briggs, Bogdan Chadkin
Released: November 4, 2013
Related Topics: sass, less, ast,
Last updated: 2025-01-28 00:23:16 UTC
JSON Representation

https://github.com/bntzio/aguayo-frontend-test

Página web con responsive design (mobile first)

cssnext gulp postcss webpack

Last synced: 30 Dec 2024

https://github.com/blackoutseeker/felips-rfe

My Final Internship Report in website format

eslint nextjs postcss prettier reactjs tailwindcss typescript

Last synced: 26 Jan 2025

https://github.com/mirzobox/tic-tac-toe-selfmade

Tic, Tac, Toe game. Used min-max algorithm.

daisyui html javascript js-modules min-max-algorithm postcss tailwindcss vitejs

Last synced: 21 Jan 2025

https://github.com/hemanthkumarsunkari27/food-website

A visually appealing and user-friendly food website allowing users to browse various food items, view details, and explore recipes or descriptions. Built with HTML, CSS, JavaScript, and bundled with Vite for fast, optimized loading.

css food-website front-end html javascript postcss recipes responsive-design vite web-development

Last synced: 25 Jan 2025

https://github.com/ambar/docz-plugin-style

PostCSS Preset Env + CSS Modlues

docz docz-plugin postcss

Last synced: 02 Jan 2025

https://github.com/awayken/postcss-placeholdit

PostCSS plugin that uses the placehold.it service as a placeholder for broken background images.

postcss

Last synced: 10 Jan 2025

https://github.com/josealz/disco

Discord clone

autoprefixer build deploy firebase gh-pages git github odin-project postcss react tailwindcss vscode

Last synced: 25 Dec 2024

https://github.com/kailoon/11ty-starter-kit-with-scss

Based on the official starter kit and come with 7 in 1 folder structure SCSS development using postcss, purgecss and cssnano.

11ty eleventy html nunjucks postcss purgecss scss starter-kit

Last synced: 06 Dec 2024

https://github.com/kailoon/postcss-starter

Postcss starter is a starter kit for any project using postcss.

css nodejs pnpm postcss starter

Last synced: 06 Dec 2024

https://github.com/dormanator/pomodoro-clock

A simple Pomodoro clock designed to help control your work patterns to ensure appropriate breaks are taken. Features graphic display of time progression, and use of the Notification API.

gulpjs html javascript postcss progressbar-js

Last synced: 10 Nov 2024

https://github.com/coder-abdo/multi-forms

multi-form project

babel7 es6 postcss react-hooks react-icons reactjs webpack4

Last synced: 14 Jan 2025

https://github.com/krypton225/multi-step-form

This is just a training in Front End Mentor website.

autoprefixer concurrently css3 cssnano html5 javascript live-server postcss postcss-cli pug-cli pugjs scss typescript webpack webpack-cli

Last synced: 26 Dec 2024

https://github.com/earth-hominid/seeds-inventory-catalog

An inventory management system for an online seed store | Full stack CRUD Application with ExpressJS

expressjs javascript mongodb mongoose mvc-architecture nodejs postcss pugjs sanitization tailwind-css validation validatorjs

Last synced: 26 Dec 2024

https://github.com/slhsxcmy/postcss-split-selectors

css npm postcss postcss-plugin

Last synced: 14 Jan 2025

https://github.com/charistheo/webpack-media-split

A simple example that splits CSS based on media queries used and generates separate files using Webpack. Those CSS files are then lazy loaded depending on screen width.

css lazy-loading mediaqueries postcss webpack

Last synced: 14 Dec 2024

https://github.com/cgutwin/frontendmentor

My completions of the Frontend Mentor projects.

css3 frontend frontend-mentor html5 postcss

Last synced: 14 Jan 2025

https://github.com/hoangnguyen77/interior-construction-quotation-fe

The frontend for interior construction quotation platform

html-css-javascript postcss reactjs scss tailwindcss vitejs

Last synced: 27 Dec 2024

https://github.com/eugenepokalyuk/vue-skateboarding

SkateHut was established in 2007 by Mark Johansen-Berg following a family holiday to Florida with his wife and three sons. When his eldest son spotted a pair of Heelys in one of the theme parks, he just had to have a pair! Upon arriving back to the UK, they realised that Heelys were nowhere to be seen.

postcss tailwind vite vue-router4 vue3

Last synced: 27 Dec 2024

https://github.com/moutinhofuturedev/data-listing

postcss radix-ui react react-hook-form react-query react-router-dom sonner tailwindcss tanstack-react-query typescript vite zod

Last synced: 27 Dec 2024

https://github.com/ravesjs/coin-tracker

track your portfolio no-auth

antd atomic-router css-modules effector farfetched feature-sliced-design javascript normalize-css postcss react scss typescript webpack

Last synced: 27 Dec 2024

https://github.com/hmontarroyos/quiz_javascript

O Projeto se trata de um Quiz de JavaScript, para o usuário testar suas habilidades na linguagem, desenvolvido na 2° Imersão React NextJS Alura

alura alura-quiz framer-motion front-end imersao-react javascript nextjs postcss react styled-components

Last synced: 15 Dec 2024

https://github.com/wvbe/dirty_deno_slapper

A Deno module that slaps your TS/CSS source together

deno esbuild postcss xhtml

Last synced: 27 Dec 2024

https://github.com/asyncbanana/asyncbanana.github.io

My personal website built with HTML, JavaScript, and PostCSS, and bundled with Parcel

parcel-bundler personal-website postcss

Last synced: 08 Jan 2025

https://github.com/dangvanthanh/web-boilerplate

Boilerplate for front end projects

babel boilerplate nunjucks postcss rollup

Last synced: 14 Jan 2025

https://github.com/eliasjuk/palpitebox

✔️ PalpiteBox

api google-api javascript nextjs nodejs postcss react tailwindcss

Last synced: 07 Jan 2025

https://github.com/sagorranait/reactjs-gallery-test

Creating a responsive image gallery using React JS

autoprefixer dnd-kit dnd-kit-sortable postcss react react-dom tailwindcss

Last synced: 27 Dec 2024

https://github.com/chrisnajman/frontend-practice-project-webpack-5

A page built from the Abstract Project design at Frontend Practice using Webpack 5

babel dart-sass html-css-javascript json postcss svg-sprites webpack5

Last synced: 21 Jan 2025

https://github.com/chrisnajman/webpack5-basic-setup

Basic Webpack 5 Setup

babel dart-sass html-css-javascript postcss svg-sprites webpack5

Last synced: 21 Jan 2025

https://github.com/chrisnajman/one-page-site-template

One-page site template with multiple elements, including accordion, carousel, modal and slide-in.

accessibility babel-es6 html-css-javascript postcss scss webpack

Last synced: 21 Jan 2025

https://github.com/vasquez-esteban/next-init

Next 14 Init Project

eslint nextjs14 postcss prettier react tailwindcss typescript

Last synced: 27 Dec 2024

https://github.com/code-sensei/nextjs-template

A robust Next.js template to kickstart your web projects. This template includes essential tools and configurations to streamline development.

eslint husky nextjs nextjs13 nextjs14 postcss react reactjs tailwindcss

Last synced: 27 Dec 2024

https://github.com/jill64/svelte-tailwind

🌀 Simplified TailwindCSS Configuration for Svelte

config css postcss sveltekit tailwind

Last synced: 10 Nov 2024

https://github.com/fluffychi-xing/templatemanage

A management system blue-print template.

element-plus frontend iconfont postcss scss tailwindcss typescript vuejs

Last synced: 27 Dec 2024

https://github.com/rnyell/postcss-contains

Style elements based on their existing property or declaration.

css postcss postcss-plugin

Last synced: 16 Nov 2024

https://github.com/treetips/react-router-redux-typescript-parcel-example

react-router-redux-typescript-parcel-example

parcel postcss prettier react redux scss tslint typescript3 vscode

Last synced: 31 Dec 2024

https://github.com/koffeine/rollup-plugin-postcss

Rollup plugin for PostCSS

postcss rollup rollup-plugin

Last synced: 21 Jan 2025

https://github.com/silvestrevivo/webpack4-starter

React starter boilerplate built with WebPack4. It contains some improvements respect the previous version, as weel as optimalizations got from the Parcel Starter respository.

babel classnames enzime eslint hot-reload html javascript jest postcss prettier prettier-eslint reactjs redux sass scss webpack4 webpack4boilerplate webpack4starter yarn

Last synced: 25 Jan 2025

https://github.com/koole/centrale-v1

🔥 dekoolecentrale.nl

postcss threejs typescript webpack

Last synced: 07 Jan 2025

https://github.com/inambe/sass-postcss-wp-template

Webpack project template with SASS and PostCSS integrated.

postcss sass webpack4

Last synced: 06 Dec 2024

https://github.com/inambe/simple-postcss-webpack-template

Simple webpack project template with PostCSS integrated.

postcss webpack4

Last synced: 06 Dec 2024

https://github.com/sagorranait/fronted-test-task

I converted the Figma design into clean, well-structured code, implementing the design elements and front-end functionality while ensuring cross-browser compatibility and responsiveness.

css globals html html-css-javascript javascript postcss react-dom reactjs tailwindcss vite

Last synced: 20 Dec 2024

https://github.com/oliverfindl/webpack-vue-boilerplate

Simple boilerplate for building Vue app with Webpack.

autoprefixer boilerplate eslint javascript postcss purgecss sass stylelint svgo terser vue vue-router vuex webpack webpack-vue-bolierplate workbox

Last synced: 14 Dec 2024

https://github.com/tobua/postcss-tags-without-class

Make HTML Tags Opt Out-Able When Adding a Class

postcss postcss-plugin

Last synced: 15 Jan 2025

https://github.com/muzabol2/calc

Simple calculator in vanilla JS

babel javascript postcss vanilla-javascript vercel webpack youtube-tutorial

Last synced: 08 Jan 2025

https://github.com/sonvice/easybank

Este proyecto es una landing page diseñada como práctica para el desafío de Frontend Mentor. La landing page está construida utilizando React, Sass

html5 javascript postcss react sass vite

Last synced: 06 Jan 2025

https://github.com/byteboomers/byteboomers-ui

Byteboomers UI

postcss ui

Last synced: 20 Dec 2024

https://github.com/silvestrevivo/react-mobiquity

Small react application fetching data from https://ergast.com/mrd/ to show custom results

axios babel eslint html5 javascript postcss reactjs sass webpack4

Last synced: 25 Jan 2025

https://github.com/fmanimashaun/netflix-clone

This is a clone of the netflix website. It is built using react and styled using tailwindcss.

axios firebase postcss react react-router redux-tt tailwindcss

Last synced: 06 Jan 2025

https://github.com/efiand/sedona

Сайт туристического городка.

a11y eslint flatpickr gulp htmlacademy image-optimization mentorship-programme pixelperfect postcss posthtml progressive-enhancement range-slider semantics sprite stylelint w3c-validation webp webpack

Last synced: 13 Jan 2025

https://github.com/saibarathr/react-audio-wave-modern

ReactWaveform is a React component that provides an interactive waveform visualization for audio files using the WaveSurfer.js library. This component supports custom controls, progress rendering, and regions for marking specific parts of the waveform.

audio-visualizer npm postcss reactjs typescript waveform

Last synced: 12 Oct 2024

https://github.com/efiand/anne-blog

Образцы страниц блога копирайтера.

a11y bem gulp image-optimization pixelperfect postcss retinal-images stylelint w3c-validation

Last synced: 13 Jan 2025

https://github.com/efiand/cooknote

Кулинарная книга с возможностью добавления и редактирования рецептов. Визуальный редактор, категории, разделы

a11y admin-panel commercial design eslint fastify favicons nodejs portfolio-project postcss postgresql semantics stylelint sveltekit

Last synced: 13 Jan 2025

https://github.com/efiand/vue-form-multistep

Форма из нескольких шагов-роутов на Vue, pinia, vuelidate. Typescript, scss, vite

eslint pinia portfolio-project postcss stylelint vite

Last synced: 13 Jan 2025

https://github.com/efiand/portfolio

Портфолио со списком работ и биографией. Все данные получаются по Github API

a11y design eslint mobile-first portfolio-project postcss posthtml semantics spa stylelint svg vue-router vuex webpack

Last synced: 13 Jan 2025

https://github.com/efiand/mobf21

Предыдущая версия сайта mobf21.com

a11y bem commercial design eslint mobile-first opengraph portfolio-project postcss schema semantics spa stylelint sveltekit webp

Last synced: 13 Jan 2025

https://github.com/efiand/scandi

Одностраничник студии дизайна интерьеров. Demo собственного сборщика

a11y bem eslint fastify htmlacademy image-optimization mentorship-programme mobile-first pixelperfect postcss semantics sprite stylelint svelte-ssr w3c-validation webp webpack

Last synced: 13 Jan 2025

https://github.com/efiand/drink2go

a11y bem esbuild favicons gulp htmlacademy leaflet mentorship-programme mobile-first pixelperfect portfolio-project postcss posthtml progressive-enhancement range-slider sprite stylelint swiper w3c-validation webp

Last synced: 13 Jan 2025

https://github.com/efiand/svelte-fastify-template

Сборка для создания простых изоморфных приложений SSR/SPA

boilerplate browser-sync eslint fastify lintspaces markdownlint portfolio-project postcss rollup sprite squoosh stylelint svelte-routing svelte-ssr svgo

Last synced: 13 Jan 2025

https://github.com/seyitbugraerden/next14-usersignandblogapp

eslint jwt jwt-auth jwt-token ldrs nextjs nextjs14 pocketbase pockethost postcss react react-cookie react-cookies tailwindcss toast toastify

Last synced: 15 Jan 2025

https://github.com/the-puppet-studios/sveltis

Sveltis is a preset for building modern Svelte applications.

nodejs postcss svelte sveltekit sveltis tailwindcss ts typescript

Last synced: 12 Oct 2024

https://github.com/newset/postcss-stylus

stylus syntax for postcss

css-modules postcss stylus

Last synced: 21 Jan 2025

https://github.com/nicolashornero/astro-personal-template

Astro + ESLint + Prettier + PostCSS

astro eslint postcss prettier stylistic

Last synced: 28 Dec 2024

https://github.com/morevm/postcss-specificity-decorator

PostCSS plugin to increase the specificity of selectors

css postcss postcss-plugin specificity

Last synced: 09 Nov 2024

https://github.com/isuke/postcss-ghost-utils

PostCSS plugin to add helper utils for your CSS

css postcss postcss-plugin

Last synced: 28 Dec 2024

https://github.com/h3rmel/sen-financa

A simple web application for personal finance management.

autoprefixer daisyui es6 localstorage postcss pwa react react-router tailwindcss vitejs

Last synced: 15 Jan 2025

https://github.com/cyansalt/postcss-transform-decl

Transform any declarations with custom rules

postcss postcss-plugin

Last synced: 28 Jan 2025

https://github.com/chrisross5/supit-project

College project (Internet technology S3): 6 versions of the same web app - built and compared UX & DX: jQuery, Vue, Vue Full, React, React Full, Svelte. Deployed on Cloudflare Pages.

bootstrap headlessui javascript jquery jquery-ui lighthouse pinia postcss react react-redux react-router react-transition-group rendering svelte sveltekit tailwindcss typescript vite vue vue-router

Last synced: 15 Jan 2025

https://github.com/takayyz/graphql-training

GraphQLの学習用

docker graphql graphql-yoga posgresql postcss pothos prisma tailwindcss ts-node-dev typescript

Last synced: 27 Dec 2024

https://github.com/cristian-sbardelotto/quizzed

⚡Welcome to Quizzed! Test your knowledge and try our quiz to challenge yourself!

eslint git github javascript postcss react react-router tailwind-css tailwind-merge typescript

Last synced: 27 Dec 2024

https://github.com/magnateape/svelte-gpt-integration

chatgpt gpt postcss svelte tailwindcss

Last synced: 28 Jan 2025

https://github.com/rakib0061/know-git

Vite.JS starter template for vanilla JavaScript, Bootstrap, sass, Gulp.js with some basic dependencies.

boilerplate-template bootstrap5 eslint gulpjs javascript popperjs postcss prettier sass vitejs

Last synced: 17 Jan 2025

https://github.com/xettri/postcss-remove-duplicate-values

A PostCSS plugin that removes duplicate CSS property values within rules, optimizing stylesheet size and improving maintainability.

css npm-package postcss postcss-plugin

Last synced: 27 Dec 2024

https://github.com/locol23/webpack-scss-starter

A boilerplate of static site using webpack + postcss(scss)

postcss scss webpack

Last synced: 08 Jan 2025

https://github.com/juanpdn/github-profile

GitHub Profile: Aplicación de búsqueda de perfiles de GitHub usando HTML, CSS y JavaScript. Permite buscar por nombre de usuario, ver seguidores, seguidos, ubicación y repositorios, y acceder a detalles de cada repositorio. Diseño responsivo y funcional.

api-rest css github-profile nextjs postcss tailwind typescript

Last synced: 11 Oct 2024

https://github.com/vinpac/webpack-modular-css-loader

Loader to transform CSS string into module

css javascript loader modular postcss webpack

Last synced: 22 Jan 2025

https://github.com/anxdydx/agencyworkflow

✨🌃💫 A web-portfolio for an online paid media agency with built-in cms backend with sanity written in next.js webframework and mongodb in collaboration.

autoprefixer cms nextjs postcss sanity tailwindscss

Last synced: 11 Oct 2024

https://github.com/habbaz-dev/utils

🔦 Various shareable configurations (ESLint, Prettier, CommitLint, Commitizen, etc.)

2024 2024-project babel commitizen commitlint config eslint habbaz habbazdev markdownlint open-source postcss prettier renovate shareable shareableconfig stylelint ts

Last synced: 11 Oct 2024

https://github.com/tomasz-sodzawiczny/postcss-plugin-chain

Utility for chaining multiple PostCSS plugins as a single one.

chain chaining plugin postcss postcss-plugin

Last synced: 22 Jan 2025

https://github.com/vlad-moskalenko/carshop-next.js

axios next postcss react react-dom tailwindcss typescript

Last synced: 16 Jan 2025

https://github.com/jvidalv/parcel2-tailwind-preact-typescript-example-2021

Example project that bundles Parcel 2 +Tailwind/jit + Preact + TypeScript.

parcel postcss preact tailwind tutorials typescript

Last synced: 28 Jan 2025

https://github.com/erkobridee/astro-ts-tw-hello

Astro Build using TypeScript plus TailwindCSS

astro devcontainer editorconfig eslint gh-pages github-actions postcss prettier tailwindcss template typescript

Last synced: 11 Oct 2024

https://github.com/tshasan/tshasan.com

A personal website built with SvelteKit, Vite, and Tailwind CSS. It utilizes modern web development tools like TypeScript, PostCSS, and pnpm.

daisyui pnpm postcss sveltekit tailwind-css vite

Last synced: 11 Oct 2024

https://github.com/iamdipankarpaul/weather-app-react

🌤️ A simple weather app built with React.js that shows current weather data, hourly forecasts, and daily forecasts using OpenWeatherMap API and Open-Meteo API.

axios daisyui eslint javascript mantine-hooks openmeteo-api openweathermap-api postcss react reacthottoast tailwindcss vite weather weather-app