Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

gradient-badge

Package Overview
Dependencies
Maintainers
1
Versions
5
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

gradient-badge

Badge generator with gradient support

  • 1.3.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
97
increased by120.45%
Maintainers
1
Weekly downloads
 
Created
Source

gradient-badge

npm Build Coverage Demo code style

Badge generator with gradient support 🍭

Check out the demo to make your own badge

Install

$ npm i gradient-badge

Usage

gradient-badge works exactly like badgen, with the gradient parameter in addition.

Node.js

const gradientBadge = require('gradient-badge');

const svgString = gradientBadge({
    subject: 'version', // <text>
    status: 'v1.2.3', // <text>
    style: 'flat', // 'flat' or undefined, optional
    // And any other parameter supported by badgen (icon, scale...)
    gradient: ['pink', 'F78642'], // array of colors (Hexadecimal or name)
});

Browser

<script src="https://cdn.jsdelivr.net/npm/gradient-badge"></script>
<script>
    var svgString = gradientBadge({
        /* same as above */
    });
</script>

Result: Result

Adding a gradient to a badge

You can apply a color gradient to any badge already generated with badgen:

const { badgen } = require('badgen');
const { applyGradient } = require('gradient-badge');

const originalBadge = badgen({
    /* ... */
});
const svgString = applyGradient(originalBadge, ['B65CFF', 'cyan']);

Examples

Here are a few more examples of what you can do.

Check out the demo to make your own

Stars Standard Patreon Instagram Vue.js Rainbow

Dependencies

  • badgen - Fast handcraft svg badge generator.

Keywords

FAQs

Package last updated on 28 Aug 2020

Did you know?

Socket

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
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc