קוד ופיתוח

21st.dev — מאגר רכיבי React ממוקד קהילה עם יצירת ממשק משופרת בעזרת בינה מלאכותית

מאגר רכיבי React ממוקד קהילה, עם יצירת ממשק בעזרת בינה מלאכותית — למי שרוצה רכיבי UI מוכנים לייצור בלי לבנות מאפס.

4 דק׳ זמן קריאה · עודכן אוגוסט 2026

נקרא גם 21st.dev · נבדק לאחרונה 2026-08-25

כרטיס-הכלי

העובדות שכדאי לדעת לפני שנרשמים

מה זה בשורה מאגר רכיבי React ממוקד קהילה עם יצירת ממשק משופרת בעזרת בינה מלאכותית
למי זה מפתחי פרונט-אנד ומהנדסי עיצוב הרוצים רכיבי ממשק מוכנים לייצור
מחיר התחלתי 6$ לחודש (כ-18 ₪) שער בנק ישראל 2.986 · 2026-08-25
יש גרסה חינמית? כן – 2 עותקי רכיבים חינמיים ביום, 100 קרדיטים בחודש
עברית אין ממשק: לא
על מה זה רץ דפדפן · ממשק-תכנות · תוסף-דפדפן
מי עומד מאחורי 21st Labs, Inc. · ארצות הברית · 2024
חברה ישראלית? לא
השורה התחתונה

21st.dev הוא מאגר של רכיבי React שהקהילה מעלה, עם שכבת בינה מלאכותית שעוזרת לייצר ולהתאים ממשקים. מתאים למפתחי פרונט-אנד שרוצים להאיץ בנייה של מסכים ולא מתחילים כל כפתור מאפס. המסלול החינמי מאפשר שתי העתקות רכיב ביום ו-100 קרדיטים בחודש, והמסלול בתשלום מתחיל ב-6$ לחודש (כ-18 ₪). אין ממשק בעברית, ותמיכה בכיווניות ימין-לשמאל לא נבדקה על ידינו — מי שבונה מוצר בעברית צריך לבדוק זאת בעצמו לפני שהוא נשען על הרכיבים.

הלב של העמוד

מה אפשר לעשות איתו בפועל

01

למצוא רכיב UI מוכן במקום לבנות אותו

רכיב React להעתקה לפרויקט

02

לייצר מסך או קטע ממשק בעזרת בינה מלאכותית

קוד רכיב ראשוני להתאמה

03

לאחד שפה עיצובית בין מסכים

סט רכיבים בסגנון עקבי

04

לחבר את המאגר לכלי פיתוח דרך ממשק-תכנות

גישה תכנותית לרכיבים

05

לשאוב השראה עיצובית לפני בנייה

רשימת דוגמאות ופתרונות קיימים

דוגמה אחת, מההתחלה לסוף

דוגמה מקצה לקצה

  1. המשימהצריך מסך תמחור עם שלושה מסלולים לאתר React קיים
  2. החיפושמחפשים במאגר רכיב מסוג pricing/כרטיסי מחיר
  3. הבחירהבוחרים רכיב שמתאים לשפה העיצובית של הפרויקט
  4. ההעתקהמעתיקים את קוד הרכיב לפרויקט — נספרת העתקה אחת מתוך שתיים היומיות
  5. ההתאמהמחליפים טקסטים, מחירים וצבעים לפי המותג
  6. הבדיקהבודקים ידנית תצוגה בעברית ובכיווניות ימין-לשמאל לפני עלייה לאוויר

זה תרחיש הדגמה שנועד להסביר את זרימת העבודה, לא תוצאה מדודה. מספר ההעתקות היומיות והקרדיטים במסלול החינמי מוגבל, ולכן כדאי לתכנן מראש אילו רכיבים באמת נחוצים.

השכבה הישראלית

עברית ו-RTL — מה ידוע

מה היצרן מצהיר היצרן לא מציין תמיכה בעברית.
מה נראה בלי מבחן איןממשק הכלי אינו בעברית.
מה לא ידוע לא הרצנו מבחן-פלט בעברית על הכלי הזה.

למי זה מתאים — ולמי לא

קח אותו אם…

  • מפתחי פרונט-אנד ב-React — אם הסטאק שלכם הוא React, זה בדיוק קהל היעד — רכיבים מוכנים להעתקה לפרויקט.
  • מהנדסי עיצוב — מי שחי בין עיצוב לקוד ומחפש רכיבים ברמת ייצור במקום מוקאפים סטטיים.
  • צוותים קטנים שמאיצים אב-טיפוס — במקום לבנות כל כרטיס וטופס מאפס, אפשר להרכיב מסך מרכיבים קיימים ולהתאים.

דלג עליו אם…

  • פרויקטים שלא בנויים על React — המאגר ממוקד ברכיבי React — למי שעובד ב-Vue, Angular או ללא פריימוורק זה פחות רלוונטי.
  • מוצרים בעברית עם דרישת ימין-לשמאל הדוקה — אין ממשק בעברית והכיווניות לא נבדקה. תצטרכו לבדוק ולהתאים כל רכיב בעצמכם.
  • מי שצריך נפח העתקות גבוה מיד — שתי העתקות ביום במסלול החינמי נגמרות מהר בפרויקט אמיתי; תצטרכו לעבור לתשלום.

כמה זה עולה באמת

מסלול לחודש בשקלים מה מקבלים
חינמי 0 ₪ 0 ₪ 2 העתקות רכיב ביום · 100 קרדיטים בחודש
בתשלום (מסלול פתיחה) 6$ לחודש (כ-18 ₪) כ-1845 ₪ שימוש מורחב מעבר למגבלות המסלול החינמי
מה באמת מקבלים בחינם

המסלול החינמי מאפשר שתי העתקות רכיב ביום ו-100 קרדיטים בחודש. זה מספיק לבדיקת התאמה ולפרויקט צד קטן, אבל לא לעבודה שוטפת על מוצר.

מבחינה ישראלית: חיוב בישראל לא פורסם. ההמרה לשקלים לפי שער בנק ישראל 2.986 מ-2026-08-25 והיא להמחשה בלבד — המחיר בפועל תלוי בשער ובעמלות של חברת האשראי, וייתכן מס ערך מוסף.

איך נמדדהמחירים נבדקו מול עמוד התמחור הרשמי ב-2026-08-25. שער בנק ישראל 2.986 · 2026-08-25. מחירים ושערים משתנים — לפני תשלום, בדקו בעמוד הרשמי.

מגבלות ומה לשים לב

לפני שמתחילים

המסלול החינמי מוגבל לשתי העתקות רכיב ביום ו-100 קרדיטים בחודש.

אין ממשק בעברית.

תמיכה בכיווניות ימין-לשמאל לא נבדקה.

המאגר ממוקד React — לא מתאים לסטאקים אחרים.

תוכן ממוקד קהילה, ולכן איכות וסגנון הרכיבים אינם אחידים.

חלופות ולמה להחליף

v0

יצירת ממשקי React בעזרת בינה מלאכותית מתוך תיאור טקסטואלי, במקום חיפוש במאגר.

Lovable

בנייה של אפליקציית ווב שלמה בעזרת בינה מלאכותית, ולא רק רכיבי ממשק בודדים.

Figma

למי שרוצה לעצב את הממשק לפני שלב הקוד ולעבוד מול מעצבים.

שאלות שחוזרות

מה זה 21st.dev בשורה אחת?

מאגר רכיבי React ממוקד קהילה, עם יצירת ממשק משופרת בעזרת בינה מלאכותית.

יש גרסה חינמית?

כן. המסלול החינמי כולל שתי העתקות רכיב ביום ו-100 קרדיטים בחודש.

כמה זה עולה?

המסלול בתשלום מתחיל ב-6$ לחודש, כ-18 ₪ לפי שער בנק ישראל 2.986 מ-2026-08-25.

יש ממשק בעברית?

לא. ממשק הכלי אינו בעברית, והיצרן לא מציין תמיכה בעברית.

האם הרכיבים עובדים בכיווניות ימין-לשמאל?

לא בדקנו. כיווניות ימין-לשמאל לא נבדקה, ולכן כדאי לבדוק כל רכיב בעצמכם לפני שימוש במוצר בעברית.

על מה זה רץ?

דפדפן, ממשק-תכנות ותוסף-דפדפן.

רוצה לנסות?

יש מסלול חינמי — כדאי להתחיל ממנו.

לאתר הרשמי

שקיפות

איך בדקנו את הכלי הזה

מה בדקנו: בדקנו את עמוד הכלי ואת פרטי התמחור והמסלול החינמי כפי שהם מפורסמים על ידי היצרן, וכן את הפלטפורמות שעליהן הכלי רץ ואת פרטי החברה.

מה לא בדקנו: לא בדקנו בעצמנו את איכות הרכיבים בפועל, את ביצועי יצירת הממשק בעזרת בינה מלאכותית, תמיכה בעברית או בכיווניות ימין-לשמאל, ולא את תנאי החיוב בישראל.

אין תשלום על מיקום. אף כלי לא משלם כדי להיכנס לאינדקס או לעלות בסדר החלופות. כך אנחנו בודקים כלים

תאריכיםנבדק 2026-08-25.

מקורות

  1. האתר הרשמי של 21st.dev. נכון ל-2026-08-25.
  2. עמוד התמחור הרשמי. נכון ל-2026-08-25.
  3. התיעוד הרשמי. נכון ל-2026-08-25.
  4. בנק ישראל — שער יציג דולר/שקל. 2026-08-25.
גילוי נאות: התוכן באתר אינו ייעוץ פיננסי, פנסיוני, מסים או השקעות. החלטות פיננסיות אישיות מומלץ לקבל בליווי בעל מקצוע מוסמך.