Reference Image Generator

Examples of the reusable ReferenceImageGenerator component

Example 1: Basic Usage

Minimal configuration with default settings. Generic subject name.

Note: Upload reference photos to generate a new image maintaining the subject's likeness. Cost: $0.04

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength: 0.8

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Advanced Settings

Inference Steps: 28

Guidance Scale: 3.5

Seed (optional)

Enable safety checker

Keep original as version backup

Example 2: Custom Subject

Customized for a specific person with custom info banner.

Note: Upload photos of Sarah Johnson to generate professional portraits. Cost: $0.04

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength: 0.8

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Advanced Settings

Inference Steps: 28

Guidance Scale: 3.5

Seed (optional)

Enable safety checker

Keep original as version backup

Example 3: Simplified (No Advanced Settings)

Simplified version without advanced settings for easier use.

Note: Upload reference photos to generate a new image maintaining the person's likeness. Cost: $0.04

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength: 0.8

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Keep original as version backup

Example 4: Custom Defaults

Pre-configured with custom default values for specific use case.

Note: Upload reference photos to generate a new image maintaining the model's likeness. Cost: $0.04

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength: 0.9

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Advanced Settings

Inference Steps: 28

Guidance Scale: 3.5

Seed (optional)

Enable safety checker

Keep original as version backup

Example 5: No Info Banner

Clean version without the informational banner.

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength:

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Advanced Settings

Inference Steps:

Guidance Scale:

Seed (optional)

Enable safety checker

Keep original as version backup

Example 6: Custom Container Styling

Custom container classes for different visual appearance.

Note: Upload reference photos to generate a new image maintaining the subject's likeness. Cost: $0.04

Reference Photos (1-3 images) *

Upload 1-3 reference photos for better likeness. Multiple photos improve accuracy.

Prompt Template (optional)

Quick-start templates for common scenarios

Prompt *

Example: "A person teaching in a classroom, warm lighting, professional setting"

Reference Strength: 0.8

More creative freedom Closer to reference

Higher values stay closer to the reference photo, lower values allow more creative interpretation

AI Model

FLUX Kontext is optimized for reference photos

Image Size

Style

Output Format

Safety Level

Enhance prompt

Advanced Settings

Inference Steps: 28

Guidance Scale: 3.5

Seed (optional)

Enable safety checker

Keep original as version backup

Code Examples

Basic Usage

<ReferenceImageGenerator 
  formId="my-form"
  subjectName="the subject"
/>

With Custom Defaults

<ReferenceImageGenerator 
  formId="custom-form"
  subjectName="John Doe"
  defaultModel="flux-kontext"
  defaultImageSize="square_hd"
  defaultOutputFormat="png"
  defaultReferenceStrength="0.9"
  showAdvancedSettings=true
/>

JavaScript Integration

Component Features

✓ Multiple reference images (1-3 photos)

✓ 8 built-in prompt templates

✓ Reference strength control (0.1-1.0)

✓ Model selection (FLUX Kontext, FLUX Pro)

✓ Image size presets (5 options)

✓ Style presets integration

✓ Output format selection (JPEG/PNG)

✓ Safety level control (6 levels)

✓ Advanced settings (steps, guidance, seed)

✓ Fully configurable via props

✓ Generic and reusable

✓ Image preview with badges

View Full Documentation