@reactslides/marketplace

A centralized system for discovering, using, and sharing themes, color schemes, templates, and presentation examples for ReactSlides.

Features

• 📦 Built-in Themes - 10+ professionally designed themes
• 🎨 Color Schemes - Quick color palette swaps
• 🔍 Search & Filter - Find themes by tags, author, or query
• 🔌 Easy Integration - Works with CLI and Web app

Installation

pnpm add @reactslides/marketplace

Usage

Using Themes in React

import { Presentation, Slide } from "reactslides";
import { corporateDark, getThemeById } from "@reactslides/marketplace";

// Use a specific theme
function App() {
  return (
    <Presentation theme={corporateDark}>
      <Slide>...</Slide>
    </Presentation>
  );
}

// Or get by ID
const theme = getThemeById("corporate-dark");

Search and Filter

import { searchThemes, searchColorSchemes, getAllThemeTags } from "@reactslides/marketplace";

// Search by query
const darkThemes = searchThemes({ query: "dark" });

// Search by tags
const businessThemes = searchThemes({ tags: ["corporate", "professional"] });

// Get all available tags
const allTags = getAllThemeTags();

Using via CLI

# List all available themes
reactslides themes list

# Apply a theme to your project
reactslides themes apply corporate-dark

# Get theme info
reactslides themes info minimalist-light

Available Themes

| Theme ID | Name | Tags | |----------|------|------| | corporate-dark | Corporate Dark | dark, corporate, professional, business | | minimalist-light | Minimalist Light | light, minimal, clean, simple | | creative-gradient | Creative Gradient | gradient, creative, vibrant, colorful, dark | | ocean-blue | Ocean Blue | blue, ocean, calm, professional, dark | | forest-green | Forest Green | green, nature, forest, eco, dark | | sunset-warm | Sunset Warm | warm, sunset, orange, pink, dark | | midnight-purple | Midnight Purple | purple, elegant, midnight, dark, sophisticated | | tech-dark | Tech Dark | tech, developer, code, dark, programming | | startup-bold | Startup Bold | startup, bold, pitch, energetic, dark | | academic-classic | Academic Classic | academic, education, classic, professional, light |

Available Color Schemes

| Scheme ID | Name | Tags | |-----------|------|------| | ocean-blue | Ocean Blue | blue, ocean, calm, professional | | sunset-warm | Sunset Warm | warm, sunset, orange, pink | | forest-mist | Forest Mist | green, nature, forest, natural | | royal-purple | Royal Purple | purple, elegant, royal, sophisticated | | rose-gold | Rose Gold | pink, gold, elegant, soft, feminine | | arctic-blue | Arctic Blue | blue, arctic, cool, modern, light | | charcoal-slate | Charcoal Slate | gray, neutral, professional, dark, slate | | emerald-night | Emerald Night | emerald, green, luxury, dark, rich |

Theme Structure

Each theme contains:

interface MarketplaceTheme {
  id: string;           // Unique identifier
  name: string;         // Display name
  description: string;  // Theme description
  author: string;       // Author name
  version: string;      // Semantic version
  tags: string[];       // Search tags
  colors: {
    primary: string;    // Main brand color
    secondary: string;  // Secondary color
    background: string; // Background color
    foreground: string; // Text color
    muted: string;      // Muted text color
    accent: string;     // Accent/highlight color
  };
  fonts: {
    heading: string;    // Heading font stack
    body: string;       // Body text font stack
    mono: string;       // Monospace font stack
  };
}

Contributing Themes

Want to add your theme to the marketplace? Check out the contribution guidelines.

License

MIT