blank-image-generator v0.2.1

Blank Image Generator

A versatile image generation library with framework wrappers and Tailwind CSS support.

Features

• Generate blank images with text and gradients
• WebAssembly core for high performance
• Framework wrappers for React, Next.js, Vue, and Svelte
• Tailwind CSS integration
• TypeScript support

Installation

Core Package

npm install blank-image-generator

Framework Wrappers

# React
npm install blank-image-generator-react

# Next.js
npm install blank-image-generator-next

# Vue
npm install blank-image-generator-vue

# Svelte
npm install blank-image-generator-svelte

Usage

React/Next.js

import { BlankImage } from 'blank-image-generator-react';
import 'blank-image-generator/dist/tailwind.css';

function MyComponent() {
  return (
    <div className="p-4 bg-gray-100">
      <BlankImage
        width={800}
        height={600}
        text="Hello World"
        backgroundColor="#ffffff"
        textColor="#000000"
        className="shadow-lg rounded-lg"
      />
    </div>
  );
}

Vue

<script setup>
import { BlankImage } from 'blank-image-generator-vue';
import 'blank-image-generator/dist/tailwind.css';
</script>

<template>
  <div class="p-4 bg-gray-100">
    <BlankImage
      :width="800"
      :height="600"
      text="Hello World"
      backgroundColor="#ffffff"
      textColor="#000000"
      class="shadow-lg rounded-lg"
    />
  </div>
</template>

Svelte

<script>
  import BlankImage from 'blank-image-generator-svelte';
  import 'blank-image-generator/dist/tailwind.css';
</script>

<div class="p-4 bg-gray-100">
  <BlankImage
    width={800}
    height={600}
    text="Hello World"
    backgroundColor="#ffffff"
    textColor="#000000"
    class="shadow-lg rounded-lg"
  />
</div>

API

Props

Tailwind CSS Integration

The package includes pre-built Tailwind CSS styles. Import the CSS file in your project:

import 'blank-image-generator/dist/tailwind.css';

You can then use Tailwind classes with the BlankImage component.

Contributing

1. Fork the repository
2. Create a new branch
3. Make your changes
4. Submit a pull request

Please follow the contribution guidelines.

License

MIT