Hebrew Tailwind Preset
Verified91/100Configure Tailwind CSS v4 for Hebrew RTL applications with dir variants, Hebrew font stacks, and logical property utilities. Use when user asks about Tailwind RTL setup, Hebrew Tailwind config, "Tailwind ivrit", RTL utility classes, logical properties in Tailwind, ms-/me- utilities, or Tailwind Hebrew font configuration. Covers Tailwind v4 dir variants, Hebrew font stack presets, logical property utilities, RTL-first component patterns, and Hebrew typography tokens. Do NOT use for general CSS RTL patterns (use hebrew-rtl-best-practices) or full design systems (use israeli-ui-design-system instead).
Trust score 91/100 (Verified) · 116+ installs · 2 GitHub contributors · MIT license
Configuring Tailwind CSS for Hebrew applications requires adjustments beyond setting dir=rtl. It involves reversed spacing, breakpoints that behave differently in RTL, Hebrew typography with custom font stacks, and dozens of small details. Without a ready-made preset, every project starts from scratch and falls into the same traps.
skills-ilnpx skills-il add skills-il/localization --skill hebrew-tailwind-preset -a claude-codeInstall on Claude.ai, Claude Desktop, ChatGPT, Manus, or other platforms
- 1. Click "Download ZIP" to download the skill files.
- 2. Open Claude Desktop and go to Customize > Skills.
- 3. Click "+" and select "Upload a skill", then upload the ZIP file.
- 4. Start a new conversation. The skill will activate automatically when relevant.
When to Apply
- When building a Hebrew RTL website needing Tailwind config with RTL support
- When using Hebrew fonts like Heebo, Assistant, or Noto Sans Hebrew
- When needing RTL variants for padding, margin, and text-align
- When upgrading from Tailwind v3 to v4 and need updated RTL support
Try These Prompts
How do I configure Tailwind CSS to work with Hebrew RTL? Including plugin setup, default direction, and support for both languages.
How do I configure a Hebrew font like Heebo or Assistant in Tailwind? Including font-family and font-face setup inside tailwind.config.
What is the difference between using ms-/me- (logical) versus ml-/mr- in Tailwind when developing a bidirectional app supporting both Hebrew and English?
Frequently Asked Questions
Related Skills
Author: skills-ilGuide developers in using Hebrew NLP models and tools including DictaLM, DictaBERT, AlephBERT, and ivrit.ai. Use when user asks about Hebrew text processing, Hebrew NLP, "ivrit", Hebrew tokenization, Hebrew NER, Hebrew sentiment analysis, Hebrew speech-to-text, or needs to process Hebrew language text programmatically. Covers model selection, preprocessing, and Hebrew-specific NLP challenges. Do NOT use for Arabic NLP (different tools) or general English NLP tasks.
Author: skills-ilImplement right-to-left (RTL) layouts for Hebrew web and mobile applications. Use when user asks about RTL layout, Hebrew text direction, bidirectional (bidi) text, Hebrew CSS, "right to left", or needs to build Hebrew UI. Covers CSS logical properties, Tailwind RTL, React/Next.js RTL setup, Hebrew typography, and font selection. Do NOT use for Arabic RTL (similar but different typography) unless user explicitly asks for shared RTL patterns.
Author: hoodiniAccess Jewish calendar data and Shabbat times via Hebcal API. Use when building apps with Shabbat times, Jewish holidays, Hebrew dates, or Zmanim. Triggers on Shabbat times, Hebcal, Jewish calendar, Hebrew date, Zmanim.
Use at your own risk. Terms of Use · Security
Want to build your own skill? Try the Skill Creator · Submit a Skill