GitHub

Contributing to HyperUI

Published: Updated:

Contributing to open source can feel overwhelming, but getting involved with HyperUI is straightforward and rewarding. Hereโ€™s how you can help make HyperUI even better.

Found a Bug or Have an Idea?

If you notice something offโ€”like a typo, accessibility issue, or SEO concernโ€”or if you have an idea for an improvement, please open an issue. This helps us discuss and plan the best way forward together.

Want to Add or Improve Something?

Thinking of adding a new component or feature? Before you start, create an issue so we can chat about your idea. For new components, sharing example designs is helpful.

Pull Request Process

All pull requests are reviewed before merging. You may receive feedbackโ€”this is part of making HyperUI great! If feedback from the first review isnโ€™t addressed by the third review, the PR will be closed. If new feedback comes up in the third review, thatโ€™s fineโ€”just address it as usual.

Setting Up HyperUI Locally

HyperUI runs on Next.js. To get started:

git clone [email protected]:markmead/hyperui.git
yarn install
yarn dev
yarn css --watch

Adding a New Component

For example, to add a new footer component in the marketing category:

  1. Create a new file in /public/components/marketing/footers.
  2. Add the component to the group in /src/data/components/marketing/footers.mdx.

Component files are named incrementally (e.g., 21, 22, etc.). Please follow this pattern.

Component Guidelines

  1. Use Tailwind CSS for all components.
  2. Only use official Tailwind CSS plugins. Declare any plugins used in the component object in the MDX file, for example: plugins: ['@tailwindcss/forms'].

See examples in the input component.

Creating a New Collection

To propose a new collection, open an issue so we can discuss and brainstorm ideas together.