Submit Your Template

Share your application templates built with the LaunchApp Design System. Submitted templates that meet our quality standards will be featured in the official template gallery.

Requirements

✓Component Usage

Templates must use exclusively LaunchApp design system components. No custom-built components or third-party UI libraries.

✓Accessibility

Full WCAG 2.1 AA compliance, keyboard navigation, proper ARIA attributes, and screen reader support.

✓Responsive Design

Mobile-first approach with proper breakpoint handling and touch-friendly interaction targets.

✓Theme Support

Full light and dark mode support using CSS custom properties and the design system token system.

✓Code Quality

Clean TypeScript code, proper component composition, no console errors, and production-ready implementation.

✓Documentation

Comprehensive README with setup, features, customization guide, and code examples.

Submission Process

1

Create Your Template

Build your application template using the LaunchApp Design System components. Follow the component guidelines and design system patterns.

2

Prepare Documentation

Write a comprehensive README that includes:

  • Template name and description
  • Key features and use cases
  • Installation and setup instructions
  • Component inventory and structure
  • Customization and theming guide
  • Usage examples and code snippets
3

Push to GitHub

Create a public repository with your template code, clear commit history, and comprehensive documentation.

4

Submit for Review

Open an issue on the design system repository with the label "template-submission" and include:

  • Link to your template repository
  • Template name and description
  • List of components used
  • Key features overview
  • Preview screenshots or live demo link

Review Timeline

Our team will review your submission within 1-2 weeks. You may receive feedback for improvements. Featured templates will be credited with author information and links to your profile.

Template Structure Example

Here's a suggested directory structure for your template:

my-template/├── src/│   ├── components/│   │   ├── Header.tsx│   │   ├── Navigation.tsx│   │   ├── Hero.tsx│   │   ├── Features.tsx│   │   ├── Footer.tsx│   │   └── index.ts│   ├── lib/│   │   └── utils.ts│   └── App.tsx├── public/│   ├── preview.png│   └── screenshot.png├── README.md├── CUSTOMIZATION.md├── package.json└── tsconfig.json

Best Practices

Use Design Tokens

Leverage CSS custom properties (--la-*) for all colors, spacing, and typography. This ensures your template respects user theme choices and customizations.

Semantic HTML

Use semantic HTML elements and proper heading hierarchy. Never skip heading levels or use divs when semantic elements are appropriate.

Component Composition

Build templates by composing design system components and blocks. Avoid prop drilling by using React Context for cross-cutting concerns.

Error Handling

Implement graceful error boundaries, proper form validation, and user-friendly error messages. Show loading states for async operations.

Performance

Optimize bundle size, implement code splitting where appropriate, and use Next.js features like Image optimization and lazy loading.

Testing

Include unit tests for complex logic and integration tests for critical user flows. Aim for at least 70% code coverage.

Example Submission Issue

Here's a template for your submission issue on GitHub:

Title: Template Submission: [Template Name]

Description:

## Template Details
- **Name:** My Awesome Template
- **Category:** SaaS / E-commerce / Marketing
- **Repository:** https://github.com/username/template-repo
- **Live Demo:** https://demo.example.com (optional)

## Overview
[2-3 sentence description of what this template does]

## Key Features
- Feature 1
- Feature 2
- Feature 3
- Feature 4

## Components Used
- Button
- Card
- Table
- Form components
- Navigation components

## Screenshot
[Include screenshot or preview image]

## Customization
[Brief note on how users can customize this template]

## Requirements Met
- [x] Uses only LaunchApp design system components
- [x] WCAG 2.1 AA compliant
- [x] Responsive design (mobile, tablet, desktop)
- [x] Light and dark mode support
- [x] Comprehensive documentation
- [x] Production-ready code

Questions?

If you have questions about the submission process or requirements: