scalar
codewithmukesh/dotnet-claude-kit
Modern API documentation UI for .NET 10, replacing Swagger with faster rendering and built-in dark mode.
What is scalar?
Scalar is a modern, interactive API documentation UI that replaces Swagger for .NET 10 applications. It provides fast rendering, dark mode, code generation for dozens of languages, and full OpenAPI 3.1 support. Use it when setting up API documentation or when users mention Scalar, API reference UIs, or interactive API docs.
- Renders interactive OpenAPI 3.1 documentation with built-in dark mode and multiple themes
- Provides "Try It" feature to test API endpoints directly from the UI (with optional proxy disable for security)
- Pre-fills authentication credentials (Bearer, API Key, OAuth2) for development testing
- Supports multiple API document versions automatically or via explicit configuration
- Offers customizable themes (Mars, Moon, Purple, BluePlanet, Saturn, DeepSpace, Kepler, Solarized, Laserwave) and layout options (modern or classic Swagger-like)
- Generates client code for dozens of programming languages from the OpenAPI spec
How to install scalar
npx skills add https://github.com/codewithmukesh/dotnet-claude-kit --skill scalar- A .NET 10 application with OpenAPI support (via `builder.Services.AddOpenApi()`)
- For authentication UI: a document transformer that registers security schemes in the OpenAPI document
How to use scalar
- 1.Add `builder.Services.AddOpenApi()` to your service configuration
- 2.Wrap `app.MapOpenApi()` and `app.MapScalarApiReference()` in an `if (app.Environment.IsDevelopment())` check for development-only exposure
- 3.(Optional) Customize Scalar with `.WithTheme()`, `.WithTitle()`, `.WithPreferredScheme()`, and other options
- 4.(Optional) Pre-fill authentication for development by calling `.AddHttpAuthentication()`, `.WithApiKeyAuthentication()`, or `.WithOAuth2Authentication()` with test credentials
- 5.(Optional) Disable the external proxy with `.WithProxy(null)` if handling sensitive APIs
- 6.Access the UI at `/scalar/v1` (or custom route) and test endpoints via the "Try It" feature
Use cases
- Setting up interactive API documentation for internal or partner-facing APIs in development
- Replacing Swagger UI in existing .NET projects with a faster, more modern alternative
- Pre-filling test tokens in development environments so developers can immediately test endpoints without manual token entry
- Exposing multiple API versions (v1, v2-beta) under a single Scalar UI with automatic detection
- Securing API documentation in production by adding authorization requirements to both OpenAPI and Scalar endpoints
- Backend developers building .NET 10 APIs
- API teams managing documentation and developer experience
- DevOps engineers deploying APIs with security-conscious configurations
- Development teams needing interactive API testing without external tools
scalar FAQ
Only if necessary, and always behind authorization. Wrap endpoints in `if (app.Environment.IsDevelopment())` or add `.RequireAuthorization()` to both `MapOpenApi()` and `MapScalarApiReference()` for production access.
Scalar's "Try It" feature routes requests through `proxy.scalar.com` by default. Disable it with `.WithProxy(null)` for sensitive APIs to keep authentication headers local and avoid external routing.
Use `.AddHttpAuthentication()`, `.WithApiKeyAuthentication()`, or `.WithOAuth2Authentication()` with test credentials. Only do this in development; never commit real production tokens.
Yes. Register multiple OpenAPI documents with `builder.Services.AddOpenApi("v1")` and `builder.Services.AddOpenApi("v2-beta")`. Scalar automatically detects them and makes them available at `/scalar/v1` and `/scalar/v2-beta`.
The OpenAPI document must include security schemes via a document transformer. Scalar reads auth configuration from the OpenAPI spec, not from Scalar options alone. Register a transformer with `options.AddDocumentTransformer<YourSecuritySchemeTransformer>()`.
Full instructions (SKILL.md)
Source of truth, from codewithmukesh/dotnet-claude-kit.
name: scalar description: > Scalar API documentation UI for .NET 10 applications. Covers setup, themes, authentication prefill, multiple documents, layout options, and security. A modern replacement for Swagger UI. Load this skill when setting up API documentation UI, or when the user mentions "Scalar", "MapScalarApiReference", "API reference", "Swagger UI replacement", "API documentation UI", "Scalar theme", "interactive API docs", or "Try It".
Scalar
Core Principles
- Scalar replaces Swagger UI — Scalar is the recommended API documentation UI for .NET 10. Faster rendering, built-in dark mode, code generation for dozens of languages, and full OpenAPI 3.1 support.
- Development only by default — Wrap
MapScalarApiReference()in anIsDevelopment()check. API documentation exposes internal structure. If needed in production, add authorization. - Disable the proxy for sensitive APIs — Scalar's "Try It" feature routes through
proxy.scalar.comby default. Disable it with.WithProxy(null)to keep auth headers local. - Security schemes come from OpenAPI — Scalar reads security schemes from the OpenAPI document. Configure them via document transformers, not in Scalar directly.
Patterns
Basic Setup
using Scalar.AspNetCore;
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddOpenApi();
var app = builder.Build();
if (app.Environment.IsDevelopment())
{
app.MapOpenApi();
app.MapScalarApiReference(); // UI at /scalar/v1
}
app.Run();
Customized Configuration
app.MapScalarApiReference(options =>
{
options
.WithTitle("Checkout API")
.WithTheme(ScalarTheme.Mars)
.WithDefaultHttpClient(ScalarTarget.CSharp, ScalarClient.HttpClient)
.WithPreferredScheme("Bearer")
.WithProxy(null) // Disable external proxy
.WithSidebar(true);
});
Authentication Prefill (Development Only)
Pre-fill credentials so developers don't have to paste tokens manually. The OpenAPI document must already include the security scheme via a document transformer.
if (app.Environment.IsDevelopment())
{
app.MapScalarApiReference(options =>
{
options
.WithPreferredScheme("Bearer")
.AddHttpAuthentication("Bearer", auth =>
{
auth.Token = "dev-only-test-token";
});
});
}
Other auth types:
// API Key
options.WithApiKeyAuthentication(apiKey =>
{
apiKey.Token = "dev-api-key";
});
// OAuth2
options.WithOAuth2Authentication(oauth =>
{
oauth.ClientId = "your-client-id";
oauth.Scopes = ["openid", "profile"];
});
Available Themes
// ScalarTheme options: Default, Moon, Purple, BluePlanet, Saturn, Mars, DeepSpace, Kepler, Solarized, Laserwave
options.WithTheme(ScalarTheme.Mars);
Multiple API Documents
// Register multiple OpenAPI documents
builder.Services.AddOpenApi("v1");
builder.Services.AddOpenApi("v2-beta");
// Scalar picks them up automatically
app.MapOpenApi();
app.MapScalarApiReference();
// Available at /scalar/v1 and /scalar/v2-beta
Or configure documents explicitly:
app.MapScalarApiReference(options =>
{
options
.AddDocument("v1", "Production API")
.AddDocument("v2-beta", "Beta API", isDefault: true);
});
Custom Route Prefix
// Default is /scalar/{documentName}
app.MapScalarApiReference("/api-docs");
// Now at /api-docs/v1
Production with Authorization
// When partners need access to docs in production
app.MapOpenApi().RequireAuthorization("ApiDocs");
app.MapScalarApiReference().RequireAuthorization("ApiDocs");
Force Dark Mode
options.ForceDarkMode();
Classic Layout (Swagger-like)
options.WithClassicLayout();
Anti-patterns
Don't Expose Scalar in Production Without Auth
// BAD — anyone can see your API structure
app.MapOpenApi();
app.MapScalarApiReference();
// GOOD — development only
if (app.Environment.IsDevelopment())
{
app.MapOpenApi();
app.MapScalarApiReference();
}
// GOOD — production with auth
app.MapOpenApi().RequireAuthorization("ApiDocs");
app.MapScalarApiReference().RequireAuthorization("ApiDocs");
Don't Pre-fill Real Credentials
// BAD — real tokens visible in browser
options.AddHttpAuthentication("Bearer", auth =>
{
auth.Token = "eyJhbG...real-production-token";
});
// GOOD — dev-only test tokens
if (app.Environment.IsDevelopment())
{
options.AddHttpAuthentication("Bearer", auth =>
{
auth.Token = "dev-only-test-token";
});
}
Don't Forget the Security Scheme Transformer
// BAD — no auth UI in Scalar because OpenAPI doc has no security schemes
builder.Services.AddOpenApi();
app.MapScalarApiReference(options =>
{
options.WithPreferredScheme("Bearer"); // Does nothing!
});
// GOOD — register the document transformer first
builder.Services.AddOpenApi(options =>
{
options.AddDocumentTransformer<BearerSecuritySchemeTransformer>();
});
app.MapScalarApiReference(options =>
{
options.WithPreferredScheme("Bearer");
});
Don't Leave the Proxy Enabled for Sensitive APIs
// BAD — auth headers flow through proxy.scalar.com
app.MapScalarApiReference();
// GOOD — disable proxy for APIs with sensitive data
app.MapScalarApiReference(options =>
{
options.WithProxy(null);
});
Don't Use Swagger UI for New .NET 10 Projects
// BAD — Swashbuckle removed from templates, maintenance concerns
builder.Services.AddSwaggerGen();
app.UseSwaggerUI();
// GOOD — built-in OpenAPI + Scalar
builder.Services.AddOpenApi();
app.MapOpenApi();
app.MapScalarApiReference();
Decision Guide
| Scenario | Recommendation |
|---|---|
| API documentation UI | MapScalarApiReference() with MapOpenApi() |
| Development environment | Default setup with IsDevelopment() guard |
| Production API docs | Add .RequireAuthorization() to both endpoints |
| Auth testing in dev | AddHttpAuthentication() with test tokens |
| Dark theme preference | .ForceDarkMode() or .WithTheme(ScalarTheme.Moon) |
| Multiple API versions | Multiple AddOpenApi() calls — Scalar detects automatically |
| Sensitive APIs | .WithProxy(null) to disable external proxy |
| Swagger-like layout | .WithClassicLayout() |
| Custom route | app.MapScalarApiReference("/api-docs") |
Related skills
More from codewithmukesh/dotnet-claude-kit and the wider catalog.

security-scan
Deep static security scan for .NET apps across 6 layers: packages, secrets, OWASP patterns, auth, CORS, and data protection.

serilog
Structured logging for .NET 10 with configuration, enrichers, sinks, and request logging.

spec
Turn vague ideas into agreed, persisted specifications through relentless structured questioning.

tdd
Guided red-green-refactor test-driven development for .NET 10 with xUnit, WebApplicationFactory, and Testcontainers.

testing
xUnit v3, WebApplicationFactory, and Testcontainers testing patterns for .NET 10 applications.

verify
7-phase verification pipeline for .NET projects: build, diagnostics, antipatterns, tests, security, formatting, and diff review.