A React component library based on Tailwind CSS

by React

Windmill React UI

The component library for fast and accessible development of gorgeous interfaces.

Windmill React UI is a component library based on Tailwind CSS, that goes beyond usual libraries. It's built upon three principles:

  • You get dark theme using one prop
  • It's accessible out-of-the-box (and built listening to a real screen reader)
  • Easier to learn through live code examples
View Demo View Github

? Usage

Install

npm i windmill-react-ui

Inside tailwind.config.js

const windmill = require('windmill-react-ui/config')
module.exports = windmill({
  purge: [],
  theme: {
    extend: {},
  },
  variants: {},
  plugins: [],
})

Then place Windmill at the root of your project (the order doesn't matter, as long as your application is inside).

// index.js
import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
import { Windmill } from 'windmill-react-ui'

ReactDOM.render(
  <Windmill>
    <App />
  </Windmill>,
  document.getElementById('root')
)

Use components inside your project

import { Button } from 'windmill-react-ui'

function App() {
  return <Button>Hi there!</Button>
}

export default App

? Roadmap

  • [ ] Development live server (currently using Styleguidist; polutes the src directory)

Things that are not in the plans for the near future and why:

New components

This library is so fresh, that if we just add new components now, we'll be just introducing bugs and bad design decisions into more code.

So, until we get to a point that the current components are in good shape and we have a clear vision of what a good component must have, we will just work on the existing component base.

How long will it take? A week, a month, it depends on the time I can put into it.

GitHub