No. 20 · Editorial & content · 1 vote

Syllabus

Online academy — navy graph-paper heroes, highlighter actions, curriculum with free previews and a real lesson player

A clear, encouraging language for online academies, course marketplaces and learning platforms, Persian-first. Cool paper surfaces and a navy structure for heroes, the lesson player and the footer, with a faint graph-paper grid; a highlighter-orange brand that always carries dark text, and a marker-yellow stroke under the key words of a heading. Course cards share one anatomy (thumbnail with length, instructor, level, rating, price), learning paths are dotted step tracks, the curriculum is an accordion with free previews and locks, and a sticky buy card sits beside it. The student panel has a navy welcome band with folder tabs, a weekly goal ring and streak, an agenda, a classroom with a working player (chapter ticks, speed, captions, time-stamped notes, Q&A, files) and certificates with public verification.

Screens

pelleh.exampleSyllabus — Site (English, Desktop)
Syllabus — Site (English, Mobile)

Best for

  • Online academies and course marketplaces
  • Bootcamps, tutoring and language schools
  • Corporate learning and onboarding portals
  • Student panels with progress, lessons and certificates

Not ideal for

  • Luxury and fashion brands
  • Dense trading or monitoring tools
  • Children’s apps that need a playful, illustrated look

Signature moves

  1. Navy graph-paper hero with a highlighter search
  2. Marker-yellow stroke under key words
  3. One course-card anatomy: length, instructor, level, rating, price
  4. Curriculum accordion with free previews, locks and a sticky buy card
  5. Navy welcome band with folder tabs, goal ring and streak
  6. Lesson player with chapter ticks, captions and time-stamped notes

Try it with another brand color

Opens the demo with only --brand changed. The style should still read as Syllabus.

Install this skill

/plugin marketplace add tastefolio/tastefolio.github.io
/plugin install syllabus@tastefolio

Files

Rate this style

Like it? Give it a 👍 below; you sign in with GitHub. The gallery’s Top rated order counts these votes and refreshes every hour. Comments and questions are welcome too.