Baike.dev
All toolsOnline toolsAI codingTrendingOpen sourceNewsSubmit
Log in
< Back to tools
B

bootstrap-colorpicker

> 编程语言
Open source

Bootstrap Colorpicker is a modular color picker plugin for Bootstrap.

1.4K stars0 likes2 views
WebsiteGitHub

About

Bootstrap Colorpicker is a modular color picker plugin for Bootstrap.

Bootstrap Colorpicker

Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4.

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. You are still free to adapt this project and create forks and variants of it.

Install

You can get the latest version in many different ways:

  • Downloading the tarball from npm the registry: https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.4.0.tgz (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

Colorpicker version Compatible Bootstrap version Dependencies
v2.x
Documentation
Bootstrap 3 or 4
  • jQuery >= 1.10
  • Bootstrap CSS (input addon)
v3.x
Documentation
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

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.

…

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.

xml
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
  

  <script src="//code.jquery.com/jquery-3.4.1.js"></script>
  <script src="dist/js/bootstrap-colorpicker.js"></script>
  <script>
    $(function() {
      $('#demo').colorpicker({
        popover: false,
        inline: true,
        container: '#demo'
      });
    });
  </script>
</body>

Contributions

  • Issues
  • Pull Requests
  • Milestones

This project exists thanks to all the people who contribute.

Please read CONTRIBUTING before sending a pull request or issue.

License

The MIT License (MIT). Please see the License File for more information.

Credits

Written and maintained by Javi Aguilar and all other contributors.

Based on Stefan Petre's color picker (2013).

Thanks to JetBrains for supporting this project.

Issues· 0 open

View all issuesOpen on GitHub

No open issues yet, or sync has not completed.

> Tags

JavaScriptbootstrapbootstrap-colorpickerbootstrap-componentsbootstrap-plugin

No comments yet. Be the first to share.

> Details

PublishedAug 1, 2026
UpdatedSep 17, 2026
Category编程语言
PricingOpen source

> Related tools

T
TypeScript
JavaScript 的超集,为前端与全栈提供静态类型
P
Python
通用编程语言,广泛用于 Web、数据与 AI
G
Go
Google 推出的简洁高效系统语言