PHPackages redivo/bootstrap-colorpicker - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. redivo/bootstrap-colorpicker ActiveLibrary redivo/bootstrap-colorpicker ============================ Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4 (forked from itsjavi). 081JavaScript Since Dec 29Pushed 3y agoCompare [ Source](https://github.com/redivo/bootstrap-colorpicker)[ Packagist](https://packagist.org/packages/redivo/bootstrap-colorpicker)[ RSS](/packages/redivo-bootstrap-colorpicker/feed)WikiDiscussions master Synced 1mo ago READMEChangelogDependenciesVersions (1)Used By (0) Bootstrap Colorpicker ===================== [](#bootstrap-colorpicker) [Bootstrap Colorpicker](https://github.com/itsjavi/bootstrap-colorpicker/) is a modular color picker plugin for Bootstrap 4. [![Build Status](https://camo.githubusercontent.com/dd899f35d27e0322af07e0f1792897e3cef1dc915d15f3c38851af69a86530bd/68747470733a2f2f696d672e736869656c64732e696f2f7472617669732f6974736a6176692f626f6f7473747261702d636f6c6f727069636b65722f6d61737465722e7376673f7374796c653d666c61742d737175617265)](https://travis-ci.org/itsjavi/bootstrap-colorpicker)[![npm](https://camo.githubusercontent.com/7ea7e50df4f4d12d7ee1e7b860446394ccfb140f0318dc8b17f1953fba63bb8b/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f626f6f7473747261702d636f6c6f727069636b65722e7376673f7374796c653d666c61742d737175617265)](https://www.npmjs.com/package/bootstrap-colorpicker) > THIS PROJECT IS NOT MAINTAINED ANYMORE. After almost 10 years, it won't receive any further update. I recommend you using more modern solutions like [React Color](https://casesandberg.github.io/react-color/). You are still free to adapt this project and create forks and variants of it. Install ------- [](#install) You can get the latest version in many different ways: - Downloading the tarball from npm the registry: (you can change the version in the url to any released tag) - Cloning using Git: `git clone https://github.com/itsjavi/bootstrap-colorpicker.git` - Installing via NPM: `npm install bootstrap-colorpicker` - Installing via Yarn: `yarn add bootstrap-colorpicker` - Installing via Composer: `composer require itsjavi/bootstrap-colorpicker` Note that the `dist` files are only distributed via the NPM and Yarn installations. For the rest methods, you will need to generate the files initializing the project with `yarn install`and then building the code using `npm run build`. Versions -------- [](#versions) Colorpicker version Compatible Bootstrap version Dependencies [v2.x](https://github.com/itsjavi/bootstrap-colorpicker/tree/v2.x) [Documentation](https://itsjavi.com/bootstrap-colorpicker/v2) Bootstrap 3 or 4 - jQuery >= 1.10 - Bootstrap CSS (input addon) [v3.x](https://github.com/itsjavi/bootstrap-colorpicker) [Documentation](https://itsjavi.com/bootstrap-colorpicker) Bootstrap 4 or without Bootstrap - jQuery >= 2.1.0 - Bootstrap CSS (input addon, popover) - Bootstrap JS Bundle (popover) Note that the plugin may work without Bootstrap if your code is not using any of the mentioned Bootstrap dependencies. Examples -------- [](#examples) ### With Bootstrap [](#with-bootstrap) The Bootstrap JS dependency is optional and it is mainly needed for the popover support. No Bootstrap CSS is required for the plugin to work. ``` > Bootstrap Colorpicker Demo (with Bootstrap) $(function () { // Basic instantiation: $('#demo-input').colorpicker(); // Example using an event, to change the color of the #demo div background: $('#demo-input').on('colorpickerChange', function(event) { $('#demo').css('background-color', event.color.toString()); }); }); ``` ### Without Bootstrap [](#without-bootstrap) To use the plugin without Bootstrap, the `popover` option should be set to `false` or `null` and, depending on your implementation, you will usually need to set inline to `true` and a `container` selector option. ``` > Bootstrap Colorpicker Demo (without Bootstrap) $(function() { $('#demo').colorpicker({ popover: false, inline: true, container: '#demo' }); }); ``` Contributions ------------- [](#contributions) - [Issues](https://github.com/itsjavi/bootstrap-colorpicker/issues) - [Pull Requests](https://github.com/itsjavi/bootstrap-colorpicker/pulls) - [Milestones](https://github.com/itsjavi/bootstrap-colorpicker/milestones) This project exists thanks to all the [people who contribute](https://github.com/itsjavi/bootstrap-colorpicker/graphs/contributors). Please read [CONTRIBUTING](https://github.com/itsjavi/bootstrap-colorpicker/blob/master/.github/CONTRIBUTING.md)before sending a pull request or issue. License ------- [](#license) The MIT License (MIT). Please see the [License File](https://github.com/itsjavi/bootstrap-colorpicker/blob/master/LICENSE) for more information. Credits ------- [](#credits) Written and maintained by [Javi Aguilar](https://itsjavi.com) and all other contributors. *Based on Stefan Petre's color picker (2013).* *Thanks to JetBrains for supporting this project.* ### Health Score 17 — LowBetter than 6% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity9 Limited adoption so far Community19 Small or concentrated contributor base Maturity23 Early-stage or recently created project Bus Factor1 Top contributor holds 65.3% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Community Maintainers ![](https://www.gravatar.com/avatar/d800767d3829d8eb04263c269f03caec977ec3f42b4026c92c1e34c89bdc3d50?d=identicon)[georgeredivo](/maintainers/georgeredivo) --- Top Contributors [![itsjavi](https://avatars.githubusercontent.com/u/122741?v=4)](https://github.com/itsjavi "itsjavi (218 commits)")[![xaguilars](https://avatars.githubusercontent.com/u/18132022?v=4)](https://github.com/xaguilars "xaguilars (33 commits)")[![mjolnic](https://avatars.githubusercontent.com/u/22207619?v=4)](https://github.com/mjolnic "mjolnic (31 commits)")[![tanqhnguyen](https://avatars.githubusercontent.com/u/910024?v=4)](https://github.com/tanqhnguyen "tanqhnguyen (9 commits)")[![seiyria](https://avatars.githubusercontent.com/u/763609?v=4)](https://github.com/seiyria "seiyria (4 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (4 commits)")[![killthekitten](https://avatars.githubusercontent.com/u/1201569?v=4)](https://github.com/killthekitten "killthekitten (3 commits)")[![krk](https://avatars.githubusercontent.com/u/1447853?v=4)](https://github.com/krk "krk (2 commits)")[![codeodor](https://avatars.githubusercontent.com/u/23479?v=4)](https://github.com/codeodor "codeodor (2 commits)")[![Craga89](https://avatars.githubusercontent.com/u/187963?v=4)](https://github.com/Craga89 "Craga89 (2 commits)")[![duckzland](https://avatars.githubusercontent.com/u/1064954?v=4)](https://github.com/duckzland "duckzland (2 commits)")[![Jaza](https://avatars.githubusercontent.com/u/79373?v=4)](https://github.com/Jaza "Jaza (2 commits)")[![jetic83](https://avatars.githubusercontent.com/u/11157551?v=4)](https://github.com/jetic83 "jetic83 (2 commits)")[![michaelbilcot](https://avatars.githubusercontent.com/u/2457050?v=4)](https://github.com/michaelbilcot "michaelbilcot (2 commits)")[![Ninir](https://avatars.githubusercontent.com/u/855022?v=4)](https://github.com/Ninir "Ninir (2 commits)")[![will-moore](https://avatars.githubusercontent.com/u/900055?v=4)](https://github.com/will-moore "will-moore (2 commits)")[![mathieupotier](https://avatars.githubusercontent.com/u/10141454?v=4)](https://github.com/mathieupotier "mathieupotier (1 commits)")[![thiromi](https://avatars.githubusercontent.com/u/83295?v=4)](https://github.com/thiromi "thiromi (1 commits)")[![gergo85](https://avatars.githubusercontent.com/u/2959112?v=4)](https://github.com/gergo85 "gergo85 (1 commits)")[![monkeywithacupcake](https://avatars.githubusercontent.com/u/7316730?v=4)](https://github.com/monkeywithacupcake "monkeywithacupcake (1 commits)") ### Embed Badge ![Health badge](/badges/redivo-bootstrap-colorpicker/health.svg) ``` [![Health](https://phpackages.com/badges/redivo-bootstrap-colorpicker/health.svg)](https://phpackages.com/packages/redivo-bootstrap-colorpicker) ``` PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)