Increase text size in Holder.js

Question

I am using holder.js canvas to show some images on browser.

I am using the code below:

 <img data-src="holder.js/200x200/auto/300/#FF0000:#fff:14/text:Count:10" class="img-responsive" alt="Bro">

The above code ensures a canvas of

Dimensions 200*200 
Background Color: #FF0000
Foreground Color: #fff
Text: "Count:10"

The problem is that I am not able to increase the size of the text in the placeholder.

How can I increase the size of the text ? Any Help??

Answer 1

Checkout https://github.com/imsky/holder

In order to change the text size in the placeholders, you'll need to create a custom theme and use it.

After you include holder.js, add a script tag that adds the theme you want:

<script src="holder.js"></script>
<script> 
    Holder.add_theme("big", { background: #FF0000, foreground: #fff, size: 20 })
</script>

Then you can use:

data-src="holder.js/200x200/big/text:Count:10"