Socket
Socket
Sign inDemoInstall

bootstrap-colorpicker

Package Overview
Dependencies
3
Maintainers
1
Versions
27
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    bootstrap-colorpicker

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


Version published
Maintainers
1
Install size
11.3 MB
Created

Readme

Source
Logo by @reallinfo

Bootstrap Colorpicker

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

Build Status npm

Install

You can get the latest version in many different ways:

  • Downloading a ZIP file from the releases
  • Cloning using Git: git clone https://github.com/farbelous/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 versionCompatible Bootstrap versionDependencies
v2.x
Documentation
(any)
  • jQuery >= 1.10
  • Bootstrap CSS (input addon)
v3.x
Documentation
Bootstrap 4
  • 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.

Basic example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link href="//cdn.rawgit.com/twbs/bootstrap/v4.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="dist/css/bootstrap-colorpicker.css" rel="stylesheet">
</head>
<body>
  <div class="jumbotron">
      <h1>Bootstrap Colorpicker Demo</h1>
      <input id="demo" type="text" class="form-control" value="rgb(255, 128, 0)" />
  </div>
  <script src="//code.jquery.com/jquery-3.3.1.js"></script>
  <script src="//cdn.rawgit.com/twbs/bootstrap/v4.1.3/dist/js/bootstrap.bundle.min.js"></script>
  <script src="dist/js/bootstrap-colorpicker.js"></script>
  <script>
    $(function () {
      // Basic instantiation:
      $('#demo').colorpicker();
      
      // Example using an event, to change the color of the .jumbotron background:
      $('#demo').on('colorpickerChange', function(event) {
        $('.jumbotron').css('background-color', event.color.toString());
      });
    });
  </script>
</body>

Contributions

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.

Keywords

FAQs

Last updated on 02 Apr 2019

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc