К основному содержанию
скилл CX Codex

localization-l10n — скилл для Claude Code: что делает и как установить

Скилл с правилами локализации веб- и мобильных приложений. Помогает настроить переводы, региональные форматы дат и чисел, а также адаптацию вёрстки под RTL.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add Mindrally/skills --skill localization-l10n -a claude-code
Открыть на GitHub

Что делает localization-l10n

Скилл даёт ассистенту инструкции по настройке библиотек i18next или expo-localization. Он задаёт структуру каталогов с неймспейсами вроде common.json и legal.json. Это снижает хаос в файлах. Также скилл выстраивает цепочки фолбэков для региональных диалектов и напоминает об обязательных правовых блоках под GDPR.

Фиксированная ширина контейнеров ломает интерфейс при локализации. Немецкий текст часто длиннее английского на 30–50%. По этой причине скилл требует гибкую вёрстку и логические CSS-свойства вроде margin-inline-start для арабского письма. Для вывода чисел и валют он внедряет методы Intl.

Проверка качества опирается на псевдолокализацию. Она выявляет забытые без перевода строки до релиза. Также инструкция описывает ленивую загрузку словарей по неймспейсам и автоматическое определение языка в браузере.

Какие задачи решает

  • организовать структуру файлов перевода с региональными фолбэками
  • отформатировать валюты и даты через встроенный Intl API
  • перевести стили на CSS logical properties для поддержки RTL
  • выявить захардкоженные строки интерфейса с помощью псевдолокализации

Примеры запросов агенту

  • Настрой структуру папки locales для react-i18next с поддержкой en-US и es-MX
  • Перепиши стили карточки на логические свойства CSS для поддержки RTL
  • Добавь форматирование валют и дат через Intl для немецкого и японского регионов

Как установить localization-l10n

1Через Skills CLI (Vercel)

npx skills add Mindrally/skills --skill localization-l10n -a claude-code

2Вручную: положить файлы

~/.claude/skills/localization-l10n/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/localization-l10n/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о localization-l10n

Как установить localization-l10n в Claude Code?

Выполните команду npx skills add Mindrally/skills --skill localization-l10n -a claude-code. Инструкция сохранится в файле ~/.claude/skills/localization-l10n/SKILL.md.

Что делает скилл localization-l10n?

Он задаёт правила адаптации интерфейса под разные языки и регионы. В них входят стандарты работы с библиотеками переводов, форматирование чисел и зеркалирование стилей под RTL.

Как скилл предлагает решать проблему разной длины текста?

Инструкция запрещает фиксированную ширину контейнеров и требует закладывать запас в 30–50% под расширение строк. Для проверки вёрстки рекомендуется запускать псевдолокализацию.

Исходный текст

SKILL.md · Apache-2.0
---
name: localization-l10n
description: Implement localization (l10n) best practices to adapt applications for specific regions, languages, and cultural preferences.
metadata:
  maintainer: Mindrally
  source: https://github.com/Mindrally/skills
---

# Localization (l10n)

You are an expert in localization for web and mobile applications. Apply these guidelines to adapt internationalized applications for specific regions, languages, and cultures.

## Core Principles

- Localization (l10n) builds on internationalization (i18n)
- Ensure all user-facing text supports localization
- Adapt content for cultural appropriateness
- Respect regional conventions for dates, numbers, and currency
- Design for content that varies significantly between locales

## Localization Libraries

### Web Applications
- Use i18next and react-i18next for web applications
- Implement namespace-based translation organization
- Use libraries like react-intl or next-i18next for Next.js applications
- Leverage formatjs for ICU message format support

### Mobile Applications
- Use expo-localization for React Native apps
- Use react-native-i18n or expo-localization for internationalization and localization
- Support multiple languages with fallback mechanisms
- Handle device locale detection automatically

## Translation Management

### File Organization
```
locales/
  en-US/
    common.json
    legal.json
    marketing.json
  en-GB/
    common.json
    legal.json
    marketing.json
  es-ES/
    common.json
    legal.json
    marketing.json
  es-MX/
    common.json
    legal.json
    marketing.json
```

### Regional Variants
- Support regional language variants (en-US vs en-GB, es-ES vs es-MX)
- Implement fallback chains (es-MX -> es -> en)
- Handle spelling differences (color vs colour)
- Adapt terminology for regional preferences

## Locale-Specific Formatting

### Date and Time Formatting
```typescript
// Format dates according to locale
const formatDate = (date: Date, locale: string) => {
  return new Intl.DateTimeFormat(locale, {
    year: 'numeric',
    month: 'long',
    day: 'numeric'
  }).format(date);
};

// US: January 23, 2026
// UK: 23 January 2026
// Germany: 23. Januar 2026
```

### Number Formatting
```typescript
// Format numbers according to locale
const formatNumber = (num: number, locale: string) => {
  return new Intl.NumberFormat(locale).format(num);
};

// US: 1,234,567.89
// Germany: 1.234.567,89
// France: 1 234 567,89
```

### Currency Formatting
```typescript
// Format currency according to locale
const formatCurrency = (amount: number, locale: string, currency: string) => {
  return new Intl.NumberFormat(locale, {
    style: 'currency',
    currency: currency
  }).format(amount);
};

// US/USD: $1,234.56
// Germany/EUR: 1.234,56 EUR
// Japan/JPY: JPY 1,235
```

## Cultural Adaptation

### Content Localization
- Adapt imagery for cultural appropriateness
- Localize marketing content, not just translate
- Consider cultural sensitivities in color choices
- Adapt examples and references for local relevance

### Legal and Compliance
- Localize privacy policies and terms of service
- Adapt for regional legal requirements (GDPR, CCPA)
- Display appropriate regulatory information
- Handle region-specific disclaimers

## Layout and Typography

### Text Expansion
- Design for 30-50% text expansion from English
- Use flexible layouts that accommodate longer text
- Test with German (often longest) and Chinese (often shortest)
- Avoid fixed-width containers for text

### RTL Support
- Implement full RTL (right-to-left) support for Arabic, Hebrew, etc.
- Use CSS logical properties for directional layouts
- Mirror UI elements appropriately
- Handle bidirectional text (mixed LTR/RTL)

```css
/* Use logical properties for RTL support */
.card {
  margin-inline-start: 1rem;
  padding-inline-end: 0.5rem;
  text-align: start;
}
```

### Typography Considerations
- Use fonts that support required character sets
- Consider CJK (Chinese, Japanese, Korean) typography needs
- Support Arabic and other script-specific requirements
- Implement proper line breaking for different languages

## Regional Features

### Address Formats
- Adapt address forms for regional formats
- Support international phone number formats
- Handle postal/ZIP code validation by country
- Implement country-specific form validation

### Measurement Units
- Support metric and imperial units
- Display appropriate units based on locale
- Allow user preference override
- Convert values accurately

### Calendars and Time
- Support different calendar systems (Gregorian, Hijri, etc.)
- Handle timezone display preferences
- Support different week start days (Sunday vs Monday)
- Display appropriate date formats

## Testing and Quality Assurance

### Localization Testing
- Test with native speakers for each locale
- Verify layout with actual translated content
- Test all date, number, and currency formats
- Verify RTL layouts function correctly

### Automated Checks
- Implement missing translation detection
- Check for hardcoded strings in code
- Validate translation file format and completeness
- Monitor for translation quality issues

### Pseudolocalization
- Use pseudolocalization during development
- Detect hardcoded strings early
- Verify UI handles text expansion
- Test character encoding support

## Content Delivery

### Language Detection
- Detect user language from browser/device settings
- Support URL-based locale switching (/en/, /es/, /fr/)
- Persist user language preference
- Implement graceful fallback mechanisms

### Performance Optimization
- Lazy load translation files by namespace
- Cache translations appropriately
- Use CDN for static translation files
- Minimize initial translation bundle size

## Integration Best Practices

### State Management
- Store locale preference in user settings
- Sync preference across devices when logged in
- Handle locale changes without full page reload
- Update all components on locale switch

### API Integration
- Pass locale in API requests
- Return localized content from backend when appropriate
- Handle server-side locale negotiation
- Support content negotiation headers

© Mindrally · Apache-2.0 · Mindrally/skills

Похожие скиллы

Всё по теме «Фронтенд и UI» →
frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. CX Codex +1 678 700установок prototype Matt Pocock Создаёт временный прототип, чтобы проверить логику, модель состояния или вид интерфейса до работы над основным кодом. 986 201установок hyperframes heygen-com Скилл задаёт агенту правила рендера HTML-кода в видео через HyperFrames. Помогает собирать проморолики, эксплейнеры и титры прямо в коде проекта. CX Codex +1 1 200 000установок hyperframes-cli heygen-com Управляет проектами HyperFrames через терминал: собирает таймлайн, проверяет контраст кадров, запускает предпросмотр и рендерит видео локально или в облаке. CX Codex +1 1 300 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок

Из того же набора236

less-best-practices Скилл задаёт стандарты архитектуры стилей на Less: модульную структуру файлов, шкалы переменных и готовые миксины. Помогает поддерживать чистый CSS без роста специфичности селекторов. CX Codex +1 692установок llamaindex-development Скилл настраивает ИИ-ассистента на разработку RAG-пайплайнов и поиск по документам на LlamaIndex в Python. Помогает писать загрузчики, парсеры и движки запросов. CX Codex +1 691установок firebase-development Скилл задаёт правила разработки под Firebase на TypeScript и Angular: от архитектуры коллекций Firestore до тестов правил безопасности. CX Codex +1 690установок meta-prompt Скилл с набором мета-промптов: критикует ответы модели, разбирает ход решения и ставит оценку. Пригодится, когда нужно проверить качество ответа агента. CX Codex +1 691установок cloudflare-development Скилл с правилами разработки на edge-платформе Cloudflare: Workers, Pages, KV, D1, R2 и Durable Objects. Пригодится, когда агент пишет код для воркеров или настраивает wrangler.toml. CX Codex +1 689установок remix Скилл для ИИ-агента, который подсказывает, как писать Remix-приложения на TypeScript: загрузка данных, мутации и вложенные маршруты. CX Codex +1 686установок salesforce-dx Скилл задаёт агенту правила разработки на Salesforce DX: Apex, триггеры, LWC, scratch orgs и выкладка через SFDX CLI. CX Codex +1 688установок micronaut Задаёт агенту конвенции Micronaut: DI на этапе компиляции, нативные сборки GraalVM, реактивные сервисы. Пригодится, когда проект на Java и хочется, чтобы кодогенерация шла по фреймворку, а не наугад. CX Codex +1 687установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой