https://github.com/ghosh/uigradients

🔴 Beautiful colour gradients for design and code
https://github.com/ghosh/uigradients

css design gradients javascript vue

Last synced: 14 days ago
JSON representation

🔴 Beautiful colour gradients for design and code

• Host: GitHub
• URL: https://github.com/ghosh/uigradients
• Owner: ghosh
• License: mit
• Created: 2014-09-01T18:04:38.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2024-07-29T14:50:11.000Z (4 months ago)
• Last Synced: 2024-10-28T13:34:34.877Z (15 days ago)
• Topics: css, design, gradients, javascript, vue
• Language: Vue
• Homepage: http://uigradients.com/
• Size: 5.56 MB
• Stars: 5,915
• Watchers: 123
• Forks: 1,387
• Open Issues: 222
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        


  





  

    

  

  

    

  

  

    

  

  

    

  





uiGradients is a community contributed collection of beautiful multi-color gradients



---

 

## About

This is an effort to give back to the community, by the community. Hopefully this will help you draw inspiration and serve as a resource for picking gradients for your own projects.

 

## Contributing

Adding a gradient to the library is super simple. All the gradients are loaded and rendered from a single `gradients.json` file in the root.

To add your gradient, fork this repository, add your gradient colors in the HEX format along with a name to the end of the json file and submit a pull request. Don't forget the commas!

```

[

    {

        …

    },

    {

      "name": "Career",

      "colors": ["#cb202d", "#dc1e28", "#3366cc"]

    }

]

```

*NOTE* - Please keep gradient submissions and bug fixes in separate PRs.

 

### Improvements and Bugs

Please feel free to open a new issue [here](https://github.com/Ghosh/uiGradients/issues) with your suggestions or any bugs which you may have come across.

 

## Data

While there is no official api, all the gradients are present in the `gradients.json` file. The code below is an example of fetching the data via a CURL request

```

curl -i https://raw.githubusercontent.com/ghosh/uiGradients/master/gradients.json

```

 

## Built with uiGradients

A few open source projects built with uiGradients

- [UIColor-uiGradientsAdditions](https://github.com/kaiinui/UIColor-uiGradientsAdditions) - uiGradients for iOS

- [NilColorKit](https://github.com/NilStack/NilColorKit) - uiGradients made for swift

- [uigradients](https://github.com/JSBros/uigradients) - Styled components for uiGradients

- [uigradients-scss](https://github.com/subinsebastian/uigradients-scss) - uiGradients ported to scss

- [helper-uigradient](https://github.com/helpers/helper-uigradient) - Handlebar helper for uiGradients

- [Uigradients iOS Viewer](https://github.com/thexande/uiGradients-Viewer-iOS) - Open source iOS app for viewing gradients

- [Potion](http://numberpicture.com/build) - React components for declaratively composing animated, interactive visualizations

- [Randient](https://github.com/uias/Randient) - Randomised, radient gradients for iOS.

- [RandomGradient](https://github.com/Gabriel-Denys/RandomGradient) - Radomised gradients via json api

 

## License

[MIT](https://github.com/ghosh/uiGradients/blob/master/LICENSE.md)

 

✌️



A little project by @i_ghosh