Capacitor Svelte Tailwind CSS Starter Template

A Starter template for building cross-platform mobile and web applications using Capacitor, SvelteKit, and Tailwind CSS.

Features

• Cross-Platform: Build for iOS, Android, and Web from a single codebase
• Svelte: Reactive JavaScript framework with modern compiler optimizations
• SvelteKit: Web framework with file-based routing
• Tailwind CSS v4: Utility-first CSS framework
• Tailwind Typography: Beautiful typography plugin for readable content
• TypeScript: Full TypeScript support with strict type checking
• ESLint & Prettier: Code formatting and linting with consistent style
• Vite: Lightning-fast build tool and development server
• Capacitor: Native mobile app runtime with access to device APIs

Prerequisites

• Node.js (v18 or higher)
• pnpm (recommended) or npm/yarn
• For mobile development:
  • Android Studio (for Android)
  • Xcode (for iOS, macOS only)

Available Scripts

Configuration

Capacitor Configuration

The Capacitor configuration is in capacitor.config.ts:

const config: CapacitorConfig = {
  appId: 'app.getthera.app',
  appName: 'thera',
  webDir: 'build'
};

Update the appId and appName to match your application.

Tailwind CSS

Tailwind CSS is configured with:

• Typography plugin for better text styling
• CSS imports are in src/routes/layout.css

TypeScript

TypeScript is configured with:

• Strict type checking enabled
• Svelte-specific type definitions
• Modern ES2020+ target

Contributing

Feel free to submit issues and enhancement requests to help improve this starter template.

License

This project is open source and available under the MIT License.

Useful Links

• Svelte Documentation
• SvelteKit Documentation
• Tailwind CSS Documentation
• Capacitor Documentation
• Vite Documentation

Built with <3 using Svelte 5, Capacitor, and Tailwind CSS