Captcha Image Generator

A simple captcha image generator.

View Demo View Github

Install

  • npm install captcha-image
  • yarn add captcha-image

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="..." />
HTML

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;
Js