All Projects → thesephist → Blocks.css

thesephist / Blocks.css

Licence: mit
Add some dimension to your page with blocks 🚀

Projects that are alternatives of or similar to Blocks.css

Quick Free Bootstrap Theme
Free Bootstrap 4 Theme perfect for building responsive, mobile-first projects on the web suitable for businesses, startups, and agencies.
Stars: ✭ 31 (-90.61%)
Mutual labels:  design-system, ui-components
Css
The CSS design system that powers GitHub
Stars: ✭ 10,670 (+3133.33%)
Mutual labels:  design-system, ui-components
Axiom React
Axiom - Brandwatch design system and React pattern library
Stars: ✭ 41 (-87.58%)
Mutual labels:  design-system, ui-components
React Native Magnus
A Utility-First React Native UI Framework 🚀🧩
Stars: ✭ 640 (+93.94%)
Mutual labels:  design-system, ui-components
wonder-blocks
React components for Wonder Blocks design system.
Stars: ✭ 110 (-66.67%)
Mutual labels:  ui-components, design-system
Eva
💫Customizable Design System easily adaptable to your Brand.
Stars: ✭ 843 (+155.45%)
Mutual labels:  design-system, ui-components
Vitamin Web
Decathlon Design System libraries for web applications
Stars: ✭ 70 (-78.79%)
Mutual labels:  design-system, ui-components
Sugui Design System
A design system template for the SugUI components library based on styleguidist
Stars: ✭ 17 (-94.85%)
Mutual labels:  design-system, ui-components
open design system
Open Source Design System using Sketch. It's early days of my project.
Stars: ✭ 22 (-93.33%)
Mutual labels:  ui-components, design-system
visage
Visage design system
Stars: ✭ 12 (-96.36%)
Mutual labels:  ui-components, design-system
Daisyui
⭐️ ⭐️ ⭐️ ⭐️ ⭐️  Tailwind Components
Stars: ✭ 382 (+15.76%)
Mutual labels:  design-system, ui-components
elements
Lovingly crafted ui components based on web components. Works well with all Frameworks - including Angular, React and Vue.
Stars: ✭ 42 (-87.27%)
Mutual labels:  ui-components, design-system
Website
Website and documentation for Radix.
Stars: ✭ 45 (-86.36%)
Mutual labels:  design-system, ui-components
carbon-components-svelte
Svelte implementation of the Carbon Design System
Stars: ✭ 1,615 (+389.39%)
Mutual labels:  ui-components, design-system
bui
‹b› Web components for creating applications – built by Blackstone Publishing using lit-html and lit-element
Stars: ✭ 29 (-91.21%)
Mutual labels:  ui-components, design-system
sodium-ui
Sodium is a simple, modular and customizable web component library to build elegant and accessible UI pieces for your React Application.
Stars: ✭ 23 (-93.03%)
Mutual labels:  ui-components, design-system
Chakra Ui
⚡️ Simple, Modular & Accessible UI Components for your React Applications
Stars: ✭ 22,745 (+6792.42%)
Mutual labels:  ui-components
Oruga
🐛 Oruga is a lightweight library of UI components without CSS framework dependency
Stars: ✭ 297 (-10%)
Mutual labels:  ui-components
Ascollectionview
Lightweight custom collection view inspired by Airbnb.
Stars: ✭ 283 (-14.24%)
Mutual labels:  ui-components
Swiftui Drawer
A SwiftUI bottom-up controller, like in the Maps app. Drag to expand or minimize.
Stars: ✭ 280 (-15.15%)
Mutual labels:  ui-components

blocks.css ☕️

Add some dimension to your page with blocks 🚀

You can check out examples and get started with blocks.css at the GitHub Page 📖. Here's what blocks.css UI looks like, from the documentation.

blocks.css sample

Start by adding the blocks.css stylesheet to your page's <head>:

<link rel="stylesheet" href="https://unpkg.com/blocks.css/dist/blocks.min.css" />

Summary

blocks.css is the core of styles used in my projects like Codeframe, Zero to Code, and Lyrics.rip. Lots of people asked for the styles, so I've pulled the button styles out into a separate package right here.

Theming

blocks.css supports theming. By default, Blocks are turquoise-green. (Why? because it's my favorite color.) But you can use CSS custom properties to modify the color and add things like a dark theme.

Check out the documentation for the full details.

Built with blocks.css

Using blocks.css in your website or app? Make a pull request to add yours to the list!

  • Codeframe: an in-browser code editor and playground
  • Read.gift: an awesome service to give and receive the gift of books
  • Plume.chat: a small in-memory real time chat server with Go and WebSockets
  • Lyrics.rip: uses Markov chains to generate lyrics for any artist with the Genius API
  • ZeroToCode.org: a place for beginner coders to learn to make stuff on the web
  • 1989.style: an online quiz about lines of lyrics from Taylor Swift's discography
  • Frieden: a public free-busy calendar that can aggregate events from multiple Google Calendar accounts
  • Tabloid: a Turing-complete programming language that reads like clickbait headlines
  • Heyyyyyyyyyyyy.com: a parody of the email service Hey.com
  • Ink programming language sandbox: a sandboxed playground for the Ink programming language
  • draw: a minimal in-memory collaborative whiteboard
  • Shelf.page: An online, public “blog-shelf” for collecting and sharing interesting reads with your audience
  • Quarantine Resume: A place to create a resume and showcase all the stuff you did during the 2020 coronavirus pandemic
  • Pkgreview.dev: a platform for developers to rate on NPM packages
  • Own2020s.com: Visualize the time you can save by cutting down on a habit
  • LinuxDeveloper.io: Personal portfolio website
  • P2Pdoc: P2Pdoc allows you to create a document and then upload it to the distributed web via IPFS

Edit on Repl.it

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].