Loading...
Loading...
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".
npx skill4agent add codewithmukesh/dotnet-claude-kit scalarMapScalarApiReference()IsDevelopment()proxy.scalar.com.WithProxy(null)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();app.MapScalarApiReference(options =>
{
options
.WithTitle("Checkout API")
.WithTheme(ScalarTheme.Mars)
.WithDefaultHttpClient(ScalarTarget.CSharp, ScalarClient.HttpClient)
.WithPreferredScheme("Bearer")
.WithProxy(null) // Disable external proxy
.WithSidebar(true);
});if (app.Environment.IsDevelopment())
{
app.MapScalarApiReference(options =>
{
options
.WithPreferredScheme("Bearer")
.AddHttpAuthentication("Bearer", auth =>
{
auth.Token = "dev-only-test-token";
});
});
}// API Key
options.WithApiKeyAuthentication(apiKey =>
{
apiKey.Token = "dev-api-key";
});
// OAuth2
options.WithOAuth2Authentication(oauth =>
{
oauth.ClientId = "your-client-id";
oauth.Scopes = ["openid", "profile"];
});// ScalarTheme options: Default, Moon, Purple, BluePlanet, Saturn, Mars, DeepSpace, Kepler, Solarized, Laserwave
options.WithTheme(ScalarTheme.Mars);// 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-betaapp.MapScalarApiReference(options =>
{
options
.AddDocument("v1", "Production API")
.AddDocument("v2-beta", "Beta API", isDefault: true);
});// Default is /scalar/{documentName}
app.MapScalarApiReference("/api-docs");
// Now at /api-docs/v1// When partners need access to docs in production
app.MapOpenApi().RequireAuthorization("ApiDocs");
app.MapScalarApiReference().RequireAuthorization("ApiDocs");options.ForceDarkMode();options.WithClassicLayout();// 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");// 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";
});
}// 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");
});// BAD — auth headers flow through proxy.scalar.com
app.MapScalarApiReference();
// GOOD — disable proxy for APIs with sensitive data
app.MapScalarApiReference(options =>
{
options.WithProxy(null);
});// BAD — Swashbuckle removed from templates, maintenance concerns
builder.Services.AddSwaggerGen();
app.UseSwaggerUI();
// GOOD — built-in OpenAPI + Scalar
builder.Services.AddOpenApi();
app.MapOpenApi();
app.MapScalarApiReference();| Scenario | Recommendation |
|---|---|
| API documentation UI | |
| Development environment | Default setup with |
| Production API docs | Add |
| Auth testing in dev | |
| Dark theme preference | |
| Multiple API versions | Multiple |
| Sensitive APIs | |
| Swagger-like layout | |
| Custom route | |