Advanced

Tutor model

i62 💰:9.4

i52 💰:7.9

🏆 i67 💰:62.5

i70 💰:125.0

i68 💰:125.0

🏆 i66 💰:75.0

i65 💰:125.0

i63 💰:62.5

i61 💰:75.0

i60 💰:9.4

i60 💰:37.5

i58 💰:62.5

i57 💰:22.5

i57 💰:37.5

i56 💰:45.0

⚡ i55 💰:11.25

i55 💰:37.5

i54 💰:62.5

i52 💰:35.0

i51 💰:37.5

i49 💰:15.0

i49 💰:62.5

i48 💰:11.3

i47 💰:7.5

i44 💰:25.0

i43 💰:37.5

i42 💰:187.5

i40 💰:5.0

i39 💰:100.0

i38 💰:37.5

i37 💰:11.0

i36 💰:187.5

i34 💰:12.5

i33 💰:37.5

i30 💰:1.0

i29 💰:1.5

i28 💰:150.0

i23 💰:20.0

i20 💰:4.0

i18 💰:1.0

i16 💰:25.0

i13 💰:1.5

Keep session private

What would you like to learn?

Override for the tutor's lesson content generation calls. Auto uses the system default (Claude Sonnet 5 for lesson text, Opus 5 for diagrams).

Lesson generation model

System default

i58 💰:18.8

i31 💰:11.0

i25 💰:31.3

Tutoring abilities

Imagine you spot a super cool star sticker at the school store with a price tag that says **4¢**.

How can you use the coins in your pocket to buy it?

A **penny** is a round, copper-colored coin that is worth **1 cent**.

We write cent with a special little symbol: **¢**.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="aspect-ratio" content="4:3">
<style>
  * { box-sizing: border-box; margin: 0; padding: 0; }
  body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: #f8f9fa;
    color: #1e2945;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    padding: 16px;
  }

  .stage {
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }

  .btn-group {
    display: flex;
    gap: 8px;
    background: #ffffff;
    padding: 4px;
    border-radius: 12px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  }

  .btn {
    border: none;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    color: #6b7280;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
  }

  .btn.active {
    background: #c87d55;
    color: #ffffff;
  }

  .display-card {
    width: 100%;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    min-height: 220px;
    justify-content: center;
  }

  .coins-tray {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px;
    min-height: 64px;
  }

  .penny {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #e29b74, #b86b43 70%, #8e4925 100%);
    box-shadow: 0 4px 8px rgba(142, 73, 37, 0.3), inset 0 2px 3px rgba(255, 255, 255, 0.4), inset 0 -2px 3px rgba(0, 0, 0, 0.3);
    border: 2px solid #a45831;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -0.5px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.3s ease, transform 0.3s ease;
  }

  .penny.visible {
    opacity: 1;
    transform: scale(1);
  }

  .equation {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
    font-weight: 700;
  }

  .tag {
    background: #f1f5f9;
    color: #1e2945;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 18px;
  }

  .total-badge {
    background: #c87d55;
    color: #ffffff;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0.5px;
    box-shadow: 0 3px 8px rgba(200, 125, 85, 0.3);
  }
</style>
</head>
<body>

<div class="stage">
  <div class="btn-group" id="selectors">
    <button class="btn" onclick="setCount(1)">1¢</button>
    <button class="btn" onclick="setCount(2)">2¢</button>
    <button class="btn" onclick="setCount(3)">3¢</button>
    <button class="btn active" onclick="setCount(4)">4¢</button>
    <button class="btn" onclick="setCount(5)">5¢</button>
  </div>

  <div class="display-card">
    <div class="coins-tray" id="tray">
      
    </div>

    <div class="equation">
      <span class="tag" id="count-label">4 Pennies</span>
      <span>=</span>
      <span class="total-badge" id="total-val">4¢</span>
    </div>
  </div>
</div>

<script>
  let currentCount = 4;

  function renderPennies() {
    const tray = document.getElementById('tray');
    tray.innerHTML = '';
    
    for (let i = 0; i < currentCount; i++) {
      const coin = document.createElement('div');
      coin.className = 'penny';
      coin.textContent = '1¢';
      tray.appendChild(coin);
      
      // Gentle stagger entry
      setTimeout(() => {
        coin.classList.add('visible');
      }, i * 40 + 20);
    }

    const countLabel = document.getElementById('count-label');
    const totalVal = document.getElementById('total-val');
    
    countLabel.textContent = currentCount === 1 ? '1 Penny' : `${currentCount} Pennies`;
    totalVal.textContent = `${currentCount}¢`;

    // Update active button
    const btns = document.querySelectorAll('.btn');
    btns.forEach((btn, idx) => {
      btn.classList.toggle('active', idx + 1 === currentCount);
    });
  }

  function setCount(n) {
    currentCount = n;
    renderPennies();
  }

  // Initial render
  renderPennies();
</script>

</body>
</html>

Since one penny equals 1 cent, how do you pay for that 4¢ sticker?

Because each penny is worth 1, counting pennies is just like regular **counting by ones**.

You set down one penny at a time and count out loud until you match the price tag.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      user-select: none;
      -webkit-user-select: none;
    }

    body {
      background: #f8f9fa;
      color: #1e2945;
      padding: 16px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      min-height: 100%;
    }

    .main-stage {
      width: 100%;
      max-width: 480px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    /* Item & Price Header */
    .item-card {
      background: #ffffff;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 12px 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      box-shadow: 0 2px 4px rgba(0,0,0,0.04);
    }

    .item-info {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .item-icon {
      font-size: 32px;
      line-height: 1;
    }

    .item-label {
      font-size: 16px;
      font-weight: 600;
      color: #1e2945;
    }

    .price-tag {
      background: #e0f2fe;
      color: #0284c7;
      border: 1.5px dashed #0284c7;
      font-size: 18px;
      font-weight: 700;
      padding: 4px 12px;
      border-radius: 8px;
    }

    /* Penny Tray */
    .tray {
      background: #ffffff;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 16px 12px;
      display: flex;
      justify-content: space-evenly;
      align-items: center;
      gap: 8px;
      min-height: 96px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.04);
    }

    .slot {
      width: 54px;
      height: 54px;
      border-radius: 50%;
      border: 2px dashed #cbd5e1;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      background: #f8fafc;
      transition: border-color 0.2s ease, background-color 0.2s ease;
      cursor: pointer;
    }

    .penny {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background: radial-gradient(circle at 35% 35%, #f59e0b, #b45309);
      border: 2px solid #78350f;
      color: #ffffff;
      font-weight: 800;
      font-size: 14px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-shadow: 0 1px 2px rgba(0,0,0,0.4);
      box-shadow: 0 3px 6px rgba(180, 83, 9, 0.35);
      opacity: 0;
      transform: scale(0.6);
      transition: opacity 0.25s ease, transform 0.25s ease;
      pointer-events: none;
    }

    .slot.active .penny {
      opacity: 1;
      transform: scale(1);
    }

    .slot.active {
      border-color: rgba(0,0,0,0);
      background: transparent;
    }

    .slot-num {
      position: absolute;
      top: -18px;
      font-size: 11px;
      font-weight: 700;
      color: #94a3b8;
    }

    .slot.active .slot-num {
      color: #b45309;
    }

    /* Counter Bar */
    .status-bar {
      background: #ffffff;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 12px 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      box-shadow: 0 2px 4px rgba(0,0,0,0.04);
    }

    .count-label {
      font-size: 15px;
      font-weight: 600;
      color: #64748b;
    }

    .count-value {
      font-size: 20px;
      font-weight: 800;
      color: #b45309;
    }

    .match-badge {
      font-size: 13px;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 6px;
      background: #f1f5f9;
      color: #94a3b8;
      transition: all 0.2s ease;
    }

    .match-badge.matched {
      background: #dcfce7;
      color: #15803d;
    }

    /* Step Navigation Controls */
    .controls {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      width: 100%;
      max-width: 480px;
      margin-top: 8px;
    }

    .btn {
      background: #ffffff;
      border: 1px solid #cbd5e1;
      color: #1e2945;
      font-size: 14px;
      font-weight: 600;
      padding: 8px 16px;
      border-radius: 8px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      transition: background 0.15s ease, border-color 0.15s ease;
    }

    .btn:active {
      background: #f1f5f9;
    }

    .btn-primary {
      background: #0284c7;
      color: #ffffff;
      border-color: #0284c7;
    }

    .btn-primary:active {
      background: #0369a1;
    }

    .step-dots {
      display: flex;
      gap: 6px;
    }

    .dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: #cbd5e1;
      cursor: pointer;
      transition: background 0.2s ease;
    }

    .dot.active {
      background: #b45309;
    }
  </style>
</head>
<body>

  <div class="main-stage">
    
    <div class="item-card">
      <div class="item-info">
        <span class="item-icon">🪀</span>
        <span class="item-label">Yo-Yo</span>
      </div>
      <div class="price-tag">5¢</div>
    </div>

    
    <div class="tray" id="tray">
      <div class="slot" data-index="1">
        <span class="slot-num">1</span>
        <div class="penny">1¢</div>
      </div>
      <div class="slot" data-index="2">
        <span class="slot-num">2</span>
        <div class="penny">1¢</div>
      </div>
      <div class="slot" data-index="3">
        <span class="slot-num">3</span>
        <div class="penny">1¢</div>
      </div>
      <div class="slot" data-index="4">
        <span class="slot-num">4</span>
        <div class="penny">1¢</div>
      </div>
      <div class="slot" data-index="5">
        <span class="slot-num">5</span>
        <div class="penny">1¢</div>
      </div>
    </div>

    
    <div class="status-bar">
      <span class="count-label">Total Paid:</span>
      <span class="count-value" id="totalText">0¢</span>
      <span class="match-badge" id="matchBadge">Count to 5¢</span>
    </div>
  </div>

  
  <div class="controls">
    <button class="btn" id="prevBtn" aria-label="Previous">◀</button>
    <div class="step-dots" id="dotsContainer">
      <div class="dot" data-step="0"></div>
      <div class="dot" data-step="1"></div>
      <div class="dot" data-step="2"></div>
      <div class="dot" data-step="3"></div>
      <div class="dot" data-step="4"></div>
      <div class="dot" data-step="5"></div>
    </div>
    <button class="btn btn-primary" id="nextBtn" aria-label="Next">+1 Penny ▶</button>
  </div>

  <script>
    const TARGET = 5;
    let currentCount = 0;
    let autoPlayTimer = null;

    const slots = document.querySelectorAll('.slot');
    const dots = document.querySelectorAll('.dot');
    const totalText = document.getElementById('totalText');
    const matchBadge = document.getElementById('matchBadge');
    const prevBtn = document.getElementById('prevBtn');
    const nextBtn = document.getElementById('nextBtn');

    function updateView(count) {
      currentCount = Math.max(0, Math.min(TARGET, count));

      // Update Penny slots
      slots.forEach((slot, idx) => {
        if (idx < currentCount) {
          slot.classList.add('active');
        } else {
          slot.classList.remove('active');
        }
      });

      // Update dots
      dots.forEach((dot, idx) => {
        dot.classList.toggle('active', idx === currentCount);
      });

      // Update total text
      totalText.textContent = `${currentCount}¢`;

      // Update match badge & button label
      if (currentCount === TARGET) {
        matchBadge.textContent = '✓ Exact Match!';
        matchBadge.classList.add('matched');
        nextBtn.textContent = '↺ Reset';
      } else {
        matchBadge.textContent = `Need ${TARGET - currentCount}¢`;
        matchBadge.classList.remove('matched');
        nextBtn.textContent = '+1 Penny ▶';
      }
    }

    // Direct slot click
    slots.forEach((slot, index) => {
      slot.addEventListener('click', () => {
        stopAutoPlay();
        updateView(index + 1 === currentCount ? index : index + 1);
      });
    });

    // Dot navigation
    dots.forEach((dot) => {
      dot.addEventListener('click', () => {
        stopAutoPlay();
        updateView(parseInt(dot.getAttribute('data-step'), 10));
      });
    });

    // Next / Reset button
    nextBtn.addEventListener('click', () => {
      stopAutoPlay();
      if (currentCount >= TARGET) {
        updateView(0);
      } else {
        updateView(currentCount + 1);
      }
    });

    // Prev button
    prevBtn.addEventListener('click', () => {
      stopAutoPlay();
      updateView(currentCount - 1);
    });

    function stopAutoPlay() {
      if (autoPlayTimer) {
        clearInterval(autoPlayTimer);
        autoPlayTimer = null;
      }
    }

    // Gentle initial auto-play demonstrating 1-by-1 counting
    function startAutoDemo() {
      let step = 0;
      autoPlayTimer = setInterval(() => {
        step = (step + 1) % (TARGET + 2);
        if (step <= TARGET) {
          updateView(step);
        } else {
          updateView(0);
        }
      }, 2000);
    }

    // Initialize
    updateView(0);
    startAutoDemo();
  </script>
</body>
</html>

What if you want to buy a shiny red pencil that costs even more — like **7¢**?

We use the exact same strategy: start at 1¢ and count up to 7¢.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="aspect-ratio" content="4:3">
<title>Counting Pennies to 7¢</title>
<style>
  * { box-sizing: border-box; margin: 0; padding: 0; }
  body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #1e2945;
    background: #f8f9fa;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    min-height: 100%;
    padding: 16px;
    user-select: none;
    -webkit-user-select: none;
  }

  /* Header / Target */
  .target-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 440px;
    background: #ffffff;
    border-radius: 12px;
    padding: 10px 16px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    border: 1px solid #e6e6e6;
  }
  .item-info {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 18px;
  }
  .item-icon { font-size: 26px; }
  .price-tag {
    background: #1e2945;
    color: #ffffff;
    padding: 4px 10px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 15px;
  }
  .running-total {
    font-size: 20px;
    font-weight: 800;
    color: #c87d55;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .running-total.matched {
    color: #16a34a;
  }

  /* Coins Grid */
  .coins-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    width: 100%;
    max-width: 440px;
    margin: 12px 0;
  }

  .coin-slot {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    touch-action: manipulation;
  }

  .count-bubble {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #e6e6e6;
    color: #6b7280;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
    transition: all 0.25s ease;
  }

  .penny {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: linear-gradient(145deg, #d88e68, #a85d38);
    border: 2px solid #df9b77;
    box-shadow: 0 3px 6px rgba(168,93,56,0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff4ec;
    font-weight: 800;
    font-size: 14px;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
    transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease;
    opacity: 0.55;
  }

  .penny-inner {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px dashed rgba(255,255,255,0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
  }

  /* Active / Counted States */
  .coin-slot.counted .penny {
    opacity: 1;
    transform: translateY(-2px);
    box-shadow: 0 5px 10px rgba(168,93,56,0.4), 0 0 0 3px #c87d55;
  }

  .coin-slot.counted .count-bubble {
    background: #c87d55;
    color: #ffffff;
    transform: scale(1.1);
  }

  .coin-slot.current .penny {
    animation: pulse 0.8s infinite alternate ease-in-out;
  }

  @keyframes pulse {
    0% { transform: translateY(-2px) scale(1); }
    100% { transform: translateY(-2px) scale(1.08); }
  }

  /* Controls */
  .controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    max-width: 440px;
  }

  .btn {
    appearance: none;
    border: none;
    background: #ffffff;
    color: #1e2945;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 18px;
    border-radius: 10px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.06);
    border: 1px solid #e6e6e6;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 0.2s ease, box-shadow 0.2s ease;
  }
  .btn:active {
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
  }
  .btn-primary {
    background: #c87d55;
    color: #ffffff;
    border-color: #c87d55;
  }

  /* Mobile scaling */
  @media (max-width: 380px) {
    .penny { width: 50px; height: 50px; }
    .penny-inner { width: 38px; height: 38px; font-size: 11px; }
    .coins-grid { gap: 8px; }
  }
</style>
</head>
<body>

  
  <div class="target-card">
    <div class="item-info">
      <span class="item-icon">🍎</span>
      <span class="price-tag">7¢</span>
    </div>
    <div class="running-total" id="totalDisplay">
      <span id="totalText">0¢</span>
      <span id="checkMark" style="display: none;">✓</span>
    </div>
  </div>

  
  <div class="coins-grid" id="coinsGrid">
    <div class="coin-slot" data-idx="1">
      <div class="count-bubble">1</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="2">
      <div class="count-bubble">2</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="3">
      <div class="count-bubble">3</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="4">
      <div class="count-bubble">4</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="5">
      <div class="count-bubble">5</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="6">
      <div class="count-bubble">6</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
    <div class="coin-slot" data-idx="7">
      <div class="count-bubble">7</div>
      <div class="penny"><div class="penny-inner">1¢</div></div>
    </div>
  </div>

  
  <div class="controls">
    <button class="btn btn-primary" id="stepBtn">▶ Touch &amp; Count</button>
    <button class="btn" id="resetBtn">↺ Reset</button>
  </div>

<script>
  let count = 0;
  const maxPennies = 7;
  const slots = document.querySelectorAll('.coin-slot');
  const totalText = document.getElementById('totalText');
  const totalDisplay = document.getElementById('totalDisplay');
  const checkMark = document.getElementById('checkMark');
  const stepBtn = document.getElementById('stepBtn');
  const resetBtn = document.getElementById('resetBtn');

  function render() {
    slots.forEach((slot, index) => {
      const num = index + 1;
      slot.classList.toggle('counted', num <= count);
      slot.classList.toggle('current', num === count);
    });

    totalText.textContent = count + '¢';

    if (count === maxPennies) {
      totalDisplay.classList.add('matched');
      checkMark.style.display = 'inline';
      stepBtn.textContent = '✓ Paid';
      stepBtn.disabled = true;
    } else {
      totalDisplay.classList.remove('matched');
      checkMark.style.display = 'none';
      stepBtn.textContent = '▶ Touch & Count';
      stepBtn.disabled = false;
    }
  }

  function stepCount() {
    if (count < maxPennies) {
      count++;
      render();
    }
  }

  function resetCount() {
    count = 0;
    render();
  }

  // Tap penny directly to set count up to that coin
  slots.forEach((slot) => {
    slot.addEventListener('click', () => {
      const targetIdx = parseInt(slot.getAttribute('data-idx'), 10);
      if (count === targetIdx) {
        count = targetIdx - 1; // Toggle off if tapping the current top
      } else {
        count = targetIdx;
      }
      render();
    });
  });

  stepBtn.addEventListener('click', stepCount);
  resetBtn.addEventListener('click', resetCount);

  render();
</script>
</body>
</html>

Be careful to touch each penny only once as you count so you don't give the cashier too many or too few.

Next time you see a toy eraser for **10¢**, count out ten pennies one-by-one to pay the exact price.

math

Counting Groups of Pennies to Pay for Items. Count out 1-cent pennies one-by-one to pay exact prices up to 10¢.

Count Money - Pennies Only

Early Level Mathematics and Numeracy: Using Money and Coins

Early Years Foundation & Primary: Money and Role Play Shopping

Pedagogical strategy focuses on Concrete-Pictorial-Abstract (CPA) progression embedded in dramatic play (e.g., classroom role-play shop). For P1 / Early Level learners, counting out money up to $10¢$ reinforces foundational counting principles (stable order, 1-to-1 correspondence, cardinality, and abstraction) while developing functional financial literacy as outlined in CfE MNU 0-09a. Teachers should emphasize physical separation of 'spent' coins from 'wallet' coins to build self-regulation and accuracy.

Counting Groups of Pennies to Pay for Items

Meet the Penny

Counting by Ones to Pay

Paying for Bigger Items