Course Card

Course tile with a gradient thumbnail, instructor byline, duration, and an inline progress bar.

24 lessons
Design systems for shipping teams
Beste Sözen6h 42m
58%

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Education1 } from "@/components/beste/piece/education1";

<Education1
  title="Design systems for shipping teams"
  instructor="Beste Sözen"
  lessons={24}
  lessonsLabel="lessons"
  hours="6h 42m"
  progress={58}
  tone="primary"
/>

More Education pieces

View all Education
Refactoring a big list · lesson
12:48
Chapter 4 · PerformanceRefactoring a big list into virtualized rows

Video Lesson

education4

Video lesson card with a play thumbnail, duration badge, watched bar, and a chapter eyebrow.

CS 401 · Advanced React
Submitted
Project 2 · State management patterns
Due Apr 30, 23:593 files

Assignment Card

education15

Course assignment card with a violet file tile, status pill, due date, and attachment count footer.

14
14-day streakShow up tomorrow to keep it alive.

Learning Streak

education9

Streak card with a flame badge, seven-day dot grid, and an encouraging caption underneath.

A
Graded
Essay · The ethics of automation92 / 100Compelling thesis, strong citations. Tighten the conclusion.

Grade Card

education14

Graded assignment card with a color-tinted letter tile, score fraction, and a clipped feedback excerpt.

Spanish vocab · Unit 412 due today
resolverReview
compartirLearning
el idiomaNew
bienvenidaMastered

Flashcard Deck

education27

Spaced-repetition deck summary with italic card fronts and new, learning, review, or mastered pills.

Question 3 / 10
Which hook schedules an effect after the DOM is painted?

Quiz Question

education11

Multiple-choice card with a progress bar in the header, stem text, and four lettered option rows.