Awesome Lists

awesome-styled-components

by styled-components

awesome listpushed over 3 years ago

A curated list of awesome styled-components resources đź’…

AI summary

CSS-in-JS library collection

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

stars
3.4K
forks
281
watching
45
awesome list
1
entries
198
View on GitHub

Embed the badge

Show how many awesome lists link to your project. The count updates automatically.

Awesome Lists badge
Markdown
[![Awesome Lists Badge](https://awesome.facts.dev/shield/styled-components/awesome-styled-components/links.svg)](https://awesome.facts.dev/awesome/styled-components/awesome-styled-components)
HTML
<a href="https://awesome.facts.dev/awesome/styled-components/awesome-styled-components"><img src="https://awesome.facts.dev/shield/styled-components/awesome-styled-components/links.svg" alt="Awesome Lists Badge" /></a>
Image URL
https://awesome.facts.dev/shield/styled-components/awesome-styled-components/links.svg

What's in the list

198 links in 5 sections, with live GitHub stats.activeno commit in 2y

Contents / styled-components

Contents / Built with 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

    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

    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

    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

    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

Contents / Further Reading

Contents / Archived

  • sugUI Components Library

    A UI components library and design system template

  • react-awesome-notifications

    A beautiful fully customizable React + Redux notification system built with styled-components

  • styled-bootstrap

    Bootstrap 4 Components implementation with customization in mind

  • react-super-styled

    Build responsive, semantic layouts fast with this design-agnostic toolkit

  • styled-flex-component

    Flex Element for not writing any more custom flex styles

  • styled-grid-component

    Grid Element for not writing any more custom grid styles

  • react-styled-flexbox

    Effortlessly add flexbox styles to your components using minimal code

  • Reactackle

    Open-source component library built with React and Styled Components

  • react-styled-box

    Speed up prototyping layouts with ready flex powered Box

  • styled-loaders

    Loaders Built with Preact and Styled Components

  • colors-show

    Present your application colors with style

  • react-adminlte-dash

    AdminLTE dashboard components in React

  • react-presents

    Highly customizable React slideshow framework with syntax highlighting and mobile support

  • react-progressive-bg-image

    Medium style progressive background image

  • mcs-lite-ui

    An on-premises Internet of Things cloud platform, which can be quickly built and is fast to get started with

  • last-draft

    A Draft.js Editor

  • reshake

    CSShake as a React Functional Component

  • react-teleportation

    Teleport your components to the foreground

  • react-enhanced-form

    form component

  • react-create-component-from-tag-prop

    Create a React component from a tag prop. Lets your users to choose which HTML elements get styled

  • animated-styled-component

    React Animated Styled Components

  • react-rasta

    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

    Responsive, fluid, deeply nestable, non-flexbox grid system with default or custom breakpoints

  • styled-components-spacing

    Responsive margin and padding components

  • griz

    The simplest grid system you'd ever see. Using grids with a flexbox fallback

  • styled-components-grid

    Responsive grid components

  • Rebass Grid

    Responsive React grid system built with styled-system

  • super-query

    Super media-query intuitive and easy of use

  • styled-container-query

    Use / with an easy syntax

  • subatomic

    Add inline style props to your styled components

  • with-styled-class-names

    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

    normalize.css with a styled-components mindset

  • styled-is

    Flag utility for styled-components

  • styled-components-ts

    styled-components for TypeScript

  • styled-by

    Simple and powerful lib to handle styled props

  • styled-media-query

    Easily and beautifully use media queries with custom breakpoints,

  • styled-shortcut-components

    A convenience package that wraps with

  • styled-shortcuts

    Use simple string notation to access props. No functions necessary

  • styled-components-theme

    Refers to theme colors and modifying them inline

  • styled-ax

    Functional theme property accessor(s)

  • styled-theme

    Extensible theming system

  • styled-components-breakpoint

    Utility function for using breakpoints

  • styled-props

    Allows you to set styled props in your styled-components without stress

  • styled-components-test-utils

    Utils for styled-components compatible with jest, expect, chai and jasmine

  • ReactQL

    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!

    Production-ready boilerplate with support for GraphQL, SSR, Hot-reload, and caching

  • Razzle Material UI Styled Example

    Razzle Material UI example using Express with compression

  • react-redux-styled-hot-universal

    SSR, Universal Webpack, Redux, React-router, Babel

More related projects

Add a GitHub project

Missing a project or an awesome list? Paste its GitHub URL and we fetch it right away.