Rloop.dev logo
Rloop.dev
Code Type
HomeLessons
Curriculum

All lessons

Type your way through each lesson in order — from your first tag to async JavaScript.

  • intermediate
    Lesson 01
    24
    Primary Button

    A solid filled button with hover effect — the most common call to action.

  • beginner
    Lesson 02
    67
    Your First HTML Page

    Every web page starts with this skeleton: doctype, html, head, and body.

  • advanced
    Lesson 03
    13
    Modal Dialog

    A centered popup window over a dark overlay.

  • beginner
    Lesson 04
    44
    The Main Heading

    Use the h1 tag to show the most important title on a page.

  • intermediate
    Lesson 05
    10
    Outline Button

    Outline buttons feel lighter — great for secondary actions.

  • advanced
    Lesson 06
    13
    Toast Notification

    A floating notification that slides in from a corner.

  • advanced
    Lesson 07
    7
    Dropdown Menu

    A menu that appears below a trigger button.

  • beginner
    Lesson 08
    19
    Paragraphs

    Use the p tag to write a full paragraph of text.

  • intermediate
    Lesson 09
    7
    Gradient Button

    Linear gradients make buttons feel modern and vibrant.

  • beginner
    Lesson 10
    12
    Heading Levels

    There are six heading levels from h1 to h6. Bigger number means smaller size.

…
Rloop.dev · Code Type
ImprintPrivacyTermsCookies