awesome-styled-components

CSS-in-JS library collection

A curated collection of resources and libraries for styling React applications with CSS-in-JS

A curated list of awesome styled-components resources 💅

GitHub
3k stars
45 watching
279 forks
last commit: over 1 year ago
Linked from 1 awesome list

awesomeawesome-listcsscss-in-jsreactstyled-components

Awesome Styled Components / Contents / styled-components
Official Site
GitHub 40,515 3 months ago
Spectrum
StackOverflow

Awesome Styled Components / Contents / Built with styled-components
react-data-table-component 2,057 about 2 months ago Data Table with built in sorting, pagination, selection, expandable rows and customizable styling
oah-ui 209 almost 4 years ago Component library built with four themes, grid system, ltr and rtl directions, theme system to add and edit themes
react-styled-floating-label 35 almost 2 years ago Floating label component which works with any HTML input
grape-ui 41 over 1 year ago Component library using styled-system and other open source components
styled-off-canvas 76 2 months ago Simple one-off canvas menu
React95 6,686 10 months ago Windows 95 style UI components
react-functional-select 195 almost 2 years ago Micro-sized & micro-optimized select component
Grommet Component library built with accessibility, modularity, responsiveness, and theming in mind
bootstrap-styled Bootstrap 4 Components, mixins, utilities implementations with global sharing community ecosystem in mind
react-epic-spinners 335 almost 2 years ago Reusable components for spinners
styled-react-modal 213 9 months ago Modal component with familiar API and syntactic sugar
Smooth UI 1,591 over 2 years ago UI Library / Design System
rendition 214 about 1 month ago A powerful component library for quickly building modern web apps
styled-icons 2,092 5 months ago Icons from popular icon packs (Font Awesome, Material, Octicons, etc)
@hackclub/design-system 157 about 1 year ago Flexible, reusable set of web UI components, built by
react-styled-select 108 over 3 years ago Lightweight Select control component
react-microlink 585 4 months ago Convert your links into beautiful previews
ReaKit 7,893 5 days ago Toolkit for building interactive UIs
Rebass 7,941 over 1 year ago Functional React UI component library
react-css-loaders 396 almost 5 years ago A collection of pure CSS loading components
react-simple-chatbot 1,736 7 months ago Simple chatbot / conversational-ui component
reactour 3,850 about 1 month ago Tourist Guide into your Components
uiGradients 229 about 5 years ago Drop-in component for gradients
react-aria-tooltip 57 almost 2 years ago Accessible ReactJS tooltip component
grommet-icons 334 4 months ago Iconography for grommet apps
bedrock-layout-primitives 444 16 days ago Foundational Layout Primitives for your React App
Atomic Layout 1,130 almost 2 years ago Layout composition as a physical React component
react-raster 80 over 2 years ago Advanced Grid-System, highly customizable and ready for SSR
react-flex-ready 60 over 2 years ago FlexBox grid system with property
Cinch Layout 23 almost 2 years ago React Native grid system inspired by Hedron
react-awesome-styled-grid 218 2 months ago Responsive grid system layout
styled-bootstrap-grid 167 almost 2 years ago Twitter Bootstrap v4 (grid system only)
neat-components 32 about 1 year ago Implementation of ThoughtBot's Neat grid system
styled-css-grid A tiny CSS grid layout
react-flexa 132 almost 2 years ago Implementing the flexbox CSS API responsively
react-styled-flexboxgrid 558 8 months ago Grid system based on flexbox
Hedron No-frills flex-box grid system
MetaComponent 37 about 4 years ago Migrate legacy HTML and CSS to styled components
styco 95 over 1 year ago VS Code extension to easily refactor JSX inline styles to styled components
react-components-cli 15 almost 2 years ago Client to generate styled components
theme-miner Makes it very easy and readable to create complex design systems in React with styled-components
styless 65 almost 2 years ago Style your components declaratively with familiar Less syntax
css-in-js-media 141 over 1 year ago Deal with responsive design
spacing-helper 46 over 1 year ago Standalone helper for creating consistent spacing between the elements
styled-components-extractor 27 13 days ago Extracts unbound tags in VS Code
styled-media-helper 76 over 1 year ago Write media queries
styled-tachyons 16 over 1 year ago Mix tachyons style shorthands with normal css
styled-px2vw 90 over 4 years ago Extension of styled-components with features for convert px to vw units
styled-normalize 446 10 months ago Add normalize.css
styled-email-components 257 almost 2 years ago Extension for building email-first components via inline styles
styled-breakpoints 553 12 days ago Simple and powerful custom breakpoints
styled-reboot 27 about 2 months ago Bootstrap v4 reboot.css
polished 7,638 about 2 months ago Lightweight set of Sass/Compass-style mixins/helpers
styled-reset 389 5 months ago Eric Meyer's Reset CSS
styled-transition-group 160 almost 2 years ago Create animations
shevyjs 317 almost 2 years ago Create and manage global typography and vertical rhythm
design-system-utils 539 over 4 years ago Utilities to give better access to your design system
styled-components-modifiers 297 over 1 year ago Enables BEM flavored modifiers (and responsive modifiers)
webstorm-styled-components 375 7 days ago Highlighting support in IntelliJ editors
styled-theming 1,170 about 3 years ago Create themes for your app
styled-system 7,869 10 months ago Design system utilities
styled-map 593 almost 3 years ago Super simple lib to map props to styles
styled-tools 802 almost 2 years ago Useful interpolated functions
jest-styled-components 1,584 6 months ago Jest utilities
styled-react-boilerplate 213 about 4 years ago Modern & minimal boilerplate
Generator create-redux-app 139 almost 2 years ago Adds Redux and other useful libraries, on top of create-react-app
Superstylin' 170 almost 2 years ago A Gatsby starter
react-boilerplate 29,482 over 1 year ago Highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices
ARc 2,916 almost 3 years ago Atomic React App boilerplate

Awesome Styled Components / Contents / Real Apps
Earner Your number one resource to the Finnish employment community
Nulogy Supply chain management software built with open-source
Nyxo iOS & Android App Personalized sleep coaching mobile app
Vimeo Video collaboration, video distribution and video everything else
Orbit Components 1,392 6 days ago Component library of Orbit Design System, built by and for
PageXL No code website builder to create landing pages and online stores in minutes
Taskade The unified workspace for distributed teams. Real-time collaboration and organization tool
njt.now.sh (npm jump to) is a tool and a service that provides package navigation shortcuts. It uses Next.js and involves server-side-rendering ( )
Strapi Admin Panel 63,815 4 days ago Strapi built-in admin panel to build content APIs
Jane Daily deal site offering the latest trends in fashion and home decor
Sweetgreen Android App Sweetgreen is an American fast casual restaurant chain that serves salads. It already using Styled Components for the React Native Android Application
WebGazer Uptime monitoring and analytics service
Cloverleaf Reveal insights on your team's hidden qualities
The Players Tribune The Voice of the Game
Moleskine Moleskine Digital Studio
FortniteMaster.com Professional Fortnite Battle Royale Stats
Prisma Open-Source GraphQL ORM for GraphQL Servers ( )
InVision Digital product design, workflow & collaboration
TSM Official TSM Site
Swipe Life Tinder Swipe Life
Autodesk Online CAD Editor & Viewer
Vogue Fashion, Trends, Beauty and People
Spectrum The community platform for the future ( )
Casper Better Sleep For All
Coinbase Buy & Sell Bitcoin, Ethereum, and more with trust
Typeform Turn data collection into an experience
Atlaskit Atlaskit by Atlassian ( )
ticketmaster.co.uk Tickets for concerts, theatre, football, family days out
shop.lego.com LEGO shop
Patreon Best way for artists and creators to get sustainable income and connect with fans
Target Expect More. Pay Less
Dutchie Online Cannabis Ordering & Delivery
Tab Ipsum Generate fake content easily ( )
Booben 106 almost 6 years ago Design, develop, connect data, get source code - all in one place
React Native Explorer Explorer React Native packages and examples effortlessly
Coinbase Pro US based digital asset exchange with trading UI, FIX API and REST API
rick-morty-app 13 almost 6 years ago Rick and Morty Information Portal
Hack Club Website for a global, non-profit community of high school coding clubs ( )
Helsinki Food Guide Website featuring only the best dishes in Helsinki
Atlas of of Economic Complexity Research and data visualization tool to explore global trade flows across markets, track these dynamics over time and discover new growth opportunities for every country
Outline Wiki for your team ( )
Count Minutes Application helping to be in control of time
GitPoint GitPoint is the most feature-rich unofficial GitHub client that is 100% free
en.kachkaev.ru Personal homepage built with ; also uses GraphQL, Docker, CI and microservice architecture ( )
WutTheLint Searchable catalog of linters
GetShitDone Timer to track your work tasks ( )
Swat.io Social Media Managment for Teams by
Grabient.com A beautiful and simple UI for generating web gradients. ( )
CodeSandbox An online editor tailored for React development ( )
rosesdaycare.center Marketing website with theme colors that change on refresh ( )
joeireland.com Portfolio of Joseph Ireland ( )
michaelhsu.tw A simple static homepage built with CRA pre-renderer ( )
Reactiflux Reactiflux community home build with ( )
Dirtyredz.com David McClain | Dirtyredz * About me, Latest projects and Contact ( )
sachagreif.com Personal homepage built with ( )
spaceexperience.club Brings you each day a stunning picture of our universe, Astronomy Picture of the Day. ( )
PostCSS.parts Searchable catalog of PostCSS plugins

Awesome Styled Components / Contents / Further Reading
The styled-components Happy Path
The state of CSS, CSS in JS & how styled-components is solving the problems we’ve had for decades
How styled-components works
Getting Sassy with styled-components
Writing Scalable React Apps with the Component Folder Pattern
Building a Blog With Next.js and styled-components
How to create responsive UI with styled-components
How to build a simple HackerNews feed with styled-components
Creating truly universal React component systems
Ryan Florence - Ryan's Random Thoughts on Inline Styles
Rendering Khan Academy’s Learn Menu Wherever I Please
The Future of Reusable CSS
"Scale" FUD and Style Components
The magic behind 💅 styled-components
The road to styled components, and the road ahead - Glen Maddern, Front End Center
⚡️ - Max Stoiber - The Road to Styled Components - React Conf 2017
ColdFront16 • Glenn Maddern: The Future of Reusable CSS
Create a style guide using NPM & styled-components
How to Use Styled Components in React Applications
CSS in JavaScript

Awesome Styled Components / Contents / Archived
sugUI Components Library 18 almost 6 years ago A UI components library and design system template
react-awesome-notifications 29 almost 6 years ago A beautiful fully customizable React + Redux notification system built with styled-components
styled-bootstrap 155 over 5 years ago Bootstrap 4 Components implementation with customization in mind
react-super-styled 79 almost 6 years ago Build responsive, semantic layouts fast with this design-agnostic toolkit
styled-flex-component 209 over 3 years ago Flex Element for not writing any more custom flex styles
styled-grid-component 23 about 5 years ago Grid Element for not writing any more custom grid styles
react-styled-flexbox 30 about 6 years ago Effortlessly add flexbox styles to your components using minimal code
Reactackle 279 almost 2 years ago Open-source component library built with React and Styled Components
react-styled-box 40 about 6 years ago Speed up prototyping layouts with ready flex powered Box
styled-loaders 208 about 4 years ago Loaders Built with Preact and Styled Components
colors-show 26 over 7 years ago Present your application colors with style
react-adminlte-dash 167 about 6 years ago AdminLTE dashboard components in React
react-presents Highly customizable React slideshow framework with syntax highlighting and mobile support
react-progressive-bg-image 227 7 days ago Medium style progressive background image
mcs-lite-ui 75 30 days ago An on-premises Internet of Things cloud platform, which can be quickly built and is fast to get started with
last-draft 218 over 6 years ago A Draft.js Editor
reshake 273 over 1 year ago CSShake as a React Functional Component
react-teleportation 96 almost 6 years ago Teleport your components to the foreground
react-enhanced-form 133 almost 6 years ago form component
react-create-component-from-tag-prop 18 over 6 years ago Create a React component from a tag prop. Lets your users to choose which HTML elements get styled
animated-styled-component 139 almost 2 years ago React Animated Styled Components
react-rasta 91 almost 2 years ago Responsive 12 column grid system which comes with a clean and simple API plus tons of feature -- customizable breakpoints, full screen mode, and no gutter to name a few
styled-grid-responsive 26 over 6 years ago Responsive, fluid, deeply nestable, non-flexbox grid system with default or custom breakpoints
styled-components-spacing 213 almost 2 years ago Responsive margin and padding components
griz 103 over 6 years ago The simplest grid system you'd ever see. Using grids with a flexbox fallback
styled-components-grid 220 over 1 year ago Responsive grid components
Rebass Grid 2,039 over 5 years ago Responsive React grid system built with styled-system
super-query 30 almost 2 years ago Super media-query intuitive and easy of use
styled-container-query 51 almost 2 years ago Use / with an easy syntax
subatomic 61 almost 6 years ago Add inline style props to your styled components
with-styled-class-names 28 almost 7 years ago Tiny (666 bytes gzip size) helper function/high order component to help style custom classNames props like , etc. on 3rd party components using
normalized-styled-components 50 almost 2 years ago normalize.css with a styled-components mindset
styled-is 210 almost 2 years ago Flag utility for styled-components
styled-components-ts 150 almost 6 years ago styled-components for TypeScript
styled-by 134 over 2 years ago Simple and powerful lib to handle styled props
styled-media-query Easily and beautifully use media queries with custom breakpoints,
styled-shortcut-components 13 almost 3 years ago A convenience package that wraps with
styled-shortcuts 88 over 6 years ago Use simple string notation to access props. No functions necessary
styled-components-theme 305 almost 5 years ago Refers to theme colors and modifying them inline
styled-ax 23 over 7 years ago Functional theme property accessor(s)
styled-theme 181 almost 7 years ago Extensible theming system
styled-components-breakpoint 243 about 3 years ago Utility function for using breakpoints
styled-props 241 over 5 years ago Allows you to set styled props in your styled-components without stress
styled-components-test-utils 46 3 months ago Utils for styled-components compatible with jest, expect, chai and jasmine
ReactQL 1,820 21 days ago Universal React + GraphQL starter kit written in Typescript w/ React 16, Apollo 2, SSR, hot-code reload, Brotli compression, strongly typed themes and support for SASS/LESS/PostCSS
RAN! 2,216 about 1 month ago Production-ready boilerplate with support for GraphQL, SSR, Hot-reload, and caching
Razzle Material UI Styled Example 114 about 1 month ago Razzle Material UI example using Express with compression
react-redux-styled-hot-universal 146 over 7 years ago SSR, Universal Webpack, Redux, React-router, Babel

Backlinks from these awesome lists:

More related projects: