PascalCase Converter — Transform Text to PascalCase Instantly
This PascalCase converter turns any phrase, snake_case identifier, or kebab-case slug into a valid UpperCamelCase name: "user profile card" becomes "UserProfileCard" in one click. React JSX requires PascalCase for every custom component — a lowercase-first tag like
What is PascalCase?
The PascalCase converter capitalizes the first letter of every word and removes all spaces — "user profile" becomes "UserProfile" instantly. Use it for React component names, TypeScript interfaces, class names in Java and C#, and Python class definitions. React requires PascalCase for custom components — a lowercase name is silently treated as an HTML element, not a component.
hello world example→HelloWorldExampleKey Features
Accepts snake_case, kebab-case & Spaces
Convert from any input format in one step: "user_profile_card", "user-profile-card", or "user profile card" all produce "UserProfileCard". Underscores, hyphens, and spaces are all treated as word separators.
Numbers & Mixed Input Handled
"user2 name" becomes "User2Name" and "get_http_response_200" becomes "GetHttpResponse200". Numbers stay in place without disrupting word boundary detection.
Safe for Unreleased Component Names and Private Interface Definitions
Your class names, interface names, and component identifiers never leave your device. Nothing is transmitted to any server — safe for internal project names and unreleased API schemas.
Go Language Export-Ready — PascalCase Is Go's Visibility Mechanism
In Go, an uppercase-first identifier is automatically exported and accessible outside the package. "handle http request" → "HandleHttpRequest" is a public function; a camelCase version would be package-private. Output is immediately usable as Go struct names, exported functions, interfaces, and constants.
Before & After: PascalCase Examples
Real input → output pairs showing exactly how the converter behaves
| Input | PascalCase Output |
|---|---|
hello world | HelloWorld |
user profile card | UserProfileCard |
get user service | GetUserService |
product list item | ProductListItem |
user_first_name | UserFirstName |
When to Use PascalCase
Use PascalCase for class names, React/Vue components, TypeScript interfaces, enums, type aliases, and constructor functions. In C# and .NET, PascalCase applies to almost everything including methods.
Do not use PascalCase for variables, function parameters, or JSON keys — those follow camelCase in most languages. Never use it for CSS, URLs, or file names.
PascalCase vs Other Formats
| Format | Example | Best For |
|---|---|---|
| PascalCase | UserProfileCard | React components, C#/Java class names, TypeScript interfaces, Go exported types, Python class names, Prisma/TypeORM models |
| camelCase | userProfileCard | JavaScript/TypeScript variables, function names, JSON keys, React props, object properties |
| snake_case | user_profile_card | Python variables/functions, SQL column names, database schemas, file names on Unix systems |
| CONSTANT_CASE | USER_PROFILE_CARD | Configuration constants, environment variables (.env), compile-time flags, Redux action types |
Who Should Use This Tool?
Convert component concept names — "user profile card" → "UserProfileCard" — into valid React component names that JSX requires to start with a capital letter.
Transform class and interface names from plain English specs into properly formatted PascalCase identifiers that satisfy linter rules.
Convert table names and entity descriptions into PascalCase model class names for Prisma, TypeORM, Hibernate, or Entity Framework.
Industry Standard
PascalCase is required by the Microsoft .NET Framework naming guidelines for all type names (classes, interfaces, enums, structs). The React documentation specifies PascalCase for all component names — JSX treats lowercase names as HTML elements and capitalized names as components.
PascalCase Rules: How It Works
- →Every word starts with an uppercase letter — including the first word
- →All spaces, hyphens, and underscores removed (treated as word separators)
- →"user profile card" → "UserProfileCard"
- →Numbers stay in place — "user2 name" → "User2Name"
- ×Variables and functions in JavaScript/TypeScript — use camelCase (myFunction, not MyFunction)
- ×Python variables, functions, modules — use snake_case (PEP 8)
- ×URL slugs and CSS class names — use kebab-case
- ×Constants and env vars — use CONSTANT_CASE (MY_CONSTANT)
How to Use This PascalCase Converter
- Paste or type your text into the Input Text box on the left.
- The output is converted to PascalCase instantly on the right.
- Click Copy to copy the result to your clipboard.
- Use Clear to reset and convert new text.
Key Use Cases
- →Generate React component names from Figma layer names or design spec descriptions — "primary nav bar" → "PrimaryNavBar". React JSX requires PascalCase: a lowercase-first tag like
silently renders as an unknown HTML element instead of invoking the component. ESLint's react/jsx-pascal-case rule enforces this automatically. - →Convert plain English service and class descriptions into Microsoft .NET and C# class names that follow the .NET Framework Design Guidelines — which mandate PascalCase for all public types, methods, properties, events, and namespaces. "get order history" → "GetOrderHistory" for a service method or class.
- →Build Prisma or TypeORM entity model names from database table names written in lowercase snake_case: "order_line_items" → "OrderLineItems". ORM frameworks like Prisma and TypeORM use PascalCase model class names by convention, even when the underlying SQL table uses snake_case.
- →Format Go exported function and type names — in Go, PascalCase is the visibility mechanism, not merely convention. "handle http request" → "HandleHttpRequest" is accessible from other packages; a camelCase name would be package-private. This applies to every public struct, interface, function, and constant in Go.
- →Create TypeScript interface and type alias names from user story text or API documentation: "shopping cart item" → "ShoppingCartItem". TypeScript ESLint's @typescript-eslint/naming-convention rule can enforce PascalCase for all interface and type alias declarations.
PascalCase in Programming Languages
function UserProfile() { return <div/> }interface UserProfile { name: string }public class UserProfile { }class UserProfile:public class UserProfile { }This Converter vs Manual Methods
| Method | Limitation |
|---|---|
| Manual typing in the editor | Error-prone — easy to miss the leading capital or lowercase a mid-word letter in long class names |
| VS Code multi-cursor editing | Requires keyboard shortcuts; no bulk conversion and cannot create PascalCase from plain English phrases |
| IDE "Rename" refactor (F2) | Only works on identifiers already in code — cannot produce new names from plain English or design doc text |
| Regex replace (sed/awk) | Requires regex expertise; fails on mixed-separator input and edge cases like numbers or acronyms |
| This converter | None — free, instant, browser-based, handles all input formats |
Common Mistakes & Pro Tips
- !Using PascalCase for variable names in JavaScript or TypeScript — convention (and ESLint's camelcase rule) uses camelCase for variables and functions. Writing "UserName" instead of "userName" signals to other developers that it's a constructor or class, which is misleading and will trigger @typescript-eslint/naming-convention lint errors.
- !Mixing PascalCase and camelCase in the same codebase for the same identifier type — pick one convention per category and enforce it with ESLint or Prettier. A React project should use PascalCase for all component file names and function components, and camelCase for all hooks, utilities, and non-component functions. Inconsistency breaks code search and auto-import suggestions.
- !Handling acronyms inconsistently in PascalCase — "XML parser" becoming "XMLParser" vs "XmlParser" vs "XmlParser" are all valid-looking but inconsistent. Microsoft .NET Design Guidelines recommend: capitalize only the first letter of acronyms three characters or longer ("XmlParser", "HtmlEncoder"), but capitalize both letters of two-character acronyms ("IO", "UI"). Google TypeScript Style Guide treats all acronyms as regular words: "XmlParser", "ApiClient". Pick one rule and enforce it team-wide — mixing breaks round-trip case conversion between PascalCase and camelCase.
Frequently Asked Questions
Everything you need to know about PascalCase
Why does React require component names to be in PascalCase?
+
JSX uses the casing of a tag name to determine whether it renders a native HTML element or a custom React component. Lowercase tags (<div>, <span>, <p>) map to DOM elements. Tags starting with an uppercase letter (<MyComponent>, <UserCard>) are resolved as React components defined in scope. If you name a component "userCard" and write <userCard />, React tries to render an HTML element named "usercard" — which does not exist. The react/jsx-pascal-case ESLint rule catches this automatically in most React projects.
What is the difference between PascalCase and camelCase?
+
Both join words without spaces and capitalize each new word — the only difference is the first letter. camelCase starts with a lowercase letter: "myFunctionName". PascalCase (also called UpperCamelCase) starts with an uppercase letter: "MyFunctionName". Standard convention across most languages: PascalCase for classes, types, interfaces, and React components; camelCase for variables, functions, and object properties. The two look visually identical except for the very first character, which is why React's JSX parser uses it as the signal for custom components vs HTML elements.
Which languages use PascalCase for class names?
+
PascalCase for class names is nearly universal: C#, Java, TypeScript, JavaScript (ES6 classes), Swift, Kotlin, Ruby, PHP, Dart, and Python (PEP 8). Go is slightly different — PascalCase marks any exported (public) identifier, not just class names: exported functions, structs, interfaces, constants, and variables all start with an uppercase letter. C# goes furthest: Microsoft's .NET Framework Design Guidelines mandate PascalCase for all public members including methods, properties, events, and namespaces — not just class names.
Does the converter handle acronyms like HTML or API?
+
The converter capitalizes the first letter of each word token and lowercases the rest, so "html parser" becomes "HtmlParser" and "api client" becomes "ApiClient" — not "HTMLParser" or "APIClient". This matches the Google TypeScript Style Guide and Airbnb approach, which treats acronyms as regular words. If your team follows Microsoft .NET style (two-letter acronyms fully capitalized: "IOStream", "UIHelper"; three-plus-letter acronyms first-letter only: "XmlParser"), you will need to manually adjust the result for two-letter acronyms like IO or UI.
Can I convert snake_case or kebab-case to PascalCase?
+
Yes. The converter treats underscores and hyphens as word separators, the same as spaces. "user_profile_card" → "UserProfileCard". "user-profile-card" → "UserProfileCard". This is useful when converting Python class names (which may come from snake_case database table names) into TypeScript interfaces or Java class names, or when mapping PostgreSQL table names to Prisma or TypeORM model class names.
How does PascalCase work in Go for exported identifiers?
+
In Go, the case of the first letter of an identifier is the visibility mechanism — not just a convention. Any identifier starting with an uppercase letter is automatically exported and accessible from outside the package. A lowercase-first identifier is package-private. So "HandleHttpRequest" is a public function; "handleHttpRequest" is private. This makes PascalCase structural in Go, not stylistic. The same rule applies to struct fields: a struct field named "Name" is exported; "name" is not, and JSON marshal/unmarshal silently skips unexported fields.
How do I convert text to PascalCase in Word, VS Code, or Notion?
+
None of these tools has a built-in PascalCase conversion. Microsoft Word's Shift+F3 cycles through sentence case, UPPERCASE, and lowercase — no PascalCase. VS Code has no native case command beyond upper/lowercase; the "Change Case" extension adds it. Notion has no text-case tools. For any PascalCase conversion task, paste your text into this converter, click Convert, then paste the result back. It handles plain English, snake_case, kebab-case, and mixed input in one step.