Package Exports

captcha-image

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (captcha-image) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Captcha Image Generator

A simple captcha image generator.

Install

npm install captcha-image
yarn add captcha-image

Example

Play with sandbox example here: Demo

Options

You can pass following parameters to Captcha instance in order to generate custom Captcha image

Attributes	Values
font / String	'35px Arial'
align / String	'center'
baseline / String	'middle
width / Number	300
height / Number	150
bgColor / String	#eee
color / String	#222
length / Number / Length of text	7

Events

createImage() method return HTML element parsed as String

Output

Final outcome looks like this:

<img src="..." data-key="..." />

Demo Usage

React

import Captcha from 'captcha-image';

const captchaImage = new Captcha(
  '35px Arial',
  'center',
  'middle',
  300,
  150,
  '#eee',
  '#111',
  6
).createImage();

function createMarkup(source) {
  return { __html: source };
}

function MyCaptcha() {
  return <div dangerouslySetInnerHTML={createMarkup(captchaImage)} />;
}

function App() {
  return (
    <div className='App'>
      <MyCaptcha />
    </div>
  );
}

export default App;