Convert Text to PascalCase

Learn how to convert text to PascalCase (UpperCamelCase) for class names, React components, and TypeScript types. Understand the difference between PascalCase and camelCase.

Programming Cases

Detailed Explanation

Converting Text to PascalCase

PascalCase (also called UpperCamelCase) joins multiple words together with no separators, capitalizing the first letter of every word — including the first. It is named after the Pascal programming language, which popularized this convention.

Basic Conversion

Input:  user profile card
Output: UserProfileCard

Input:  get-api-response
Output: GetApiResponse

Input:  max_retry_count
Output: MaxRetryCount

PascalCase vs. camelCase

The only difference is the first character:

PascalCase: UserProfile
camelCase:  userProfile

In most ecosystems, PascalCase is used for "types" (classes, interfaces, components) while camelCase is used for "instances" (variables, functions, methods).

Where PascalCase Is Used

// TypeScript / JavaScript — Classes and React components
class UserService { /* ... */ }
function UserProfileCard({ name }: Props) { /* ... */ }

// TypeScript — Interfaces and type aliases
interface UserResponse { id: number; name: string; }
type PaymentStatus = "pending" | "completed" | "failed";

// C# — Classes, methods, properties, namespaces
public class HttpClient { /* ... */ }
public string GetUserName() { /* ... */ }

// Go — Exported identifiers (public)
func GetUserByID(id int) (*User, error) { /* ... */ }
type DatabaseConfig struct { /* ... */ }

File Naming Conventions

In React projects, component files typically use PascalCase:

UserProfileCard.tsx
NavigationMenu.tsx
PaymentForm.tsx

This makes it easy to distinguish component files from utility files (which use camelCase or kebab-case).

Handling Acronyms

Like camelCase, there are two approaches to acronyms:

"HTTP response" → HttpResponse  (preferred)
"HTTP response" → HTTPResponse  (preserves acronym)

The first approach is recommended because it keeps word boundaries visually clear.

Conversion Algorithm

  1. Split the input into words (by spaces, hyphens, underscores, or case transitions).
  2. Lowercase each word entirely.
  3. Capitalize the first character of each word.
  4. Join all words together with no separator.

Edge Cases

  • Single word: "hello""Hello".
  • Already PascalCase: the input passes through unchanged.
  • All uppercase: "HTTP CLIENT""HttpClient".
  • Numbers: "form step 2""FormStep2".

Use Case

PascalCase is required for React and Vue component names, TypeScript interfaces and type aliases, C# class and method names, Go exported identifiers, and Java class names. When scaffolding components or generating code from templates, converting free-form text to PascalCase ensures compliance with language conventions.

Try It — Text Case Converter

Open full tool