パーセント計算機

割引、税金、チップなどの割合をすばやく計算します。

// about

ツールについて

金額とパーセントを入力すると、パーセントの値と、加算後の金額を計算します。

使い方

  1. 元の数値または金額を入力します。
  2. パーセントの値を入力します。
  3. 計算ボタンを押して、パーセント分の金額と合計を確認します。

このツールが使われる理由

  • 価格、税金、チップ、割引、予算など、さまざまな計算に使えます。
  • パーセント分の金額と最終的な合計の両方を表示します。
  • 10進数演算を使うため、金額のような値も正確に保たれます。
ガイド · 計算 · 4分で読めます

パーセント計算を完全解説:増減率、パーセントポイント、二重割引、消費税

売上はどれだけ伸びたのか。セール価格はいくらか。金利は1%上がったのか、1ポイント上がったのか。パーセントは簡単に見えますが、基準を間違えると答えが変わります。

パーセントは百あたりの割合です。パーセント計算はすべて、正しい基準(分母)を選べるかどうかにかかっており、日常のほとんどのケースは次の4つのどれかに当てはまります。

① AのB%はいくら?        A × B ÷ 100          (80,000円の15% = 12,000円)
② AはBの何%?            A ÷ B × 100          (12 ÷ 48 × 100 = 25%)
③ AからBへの増減率        (B − A) ÷ A × 100    (200 → 250 = +25%)
④ AをB%増減した値         A × (1 ± B ÷ 100)    (50,000 + 20% = 60,000)
パーセント計算の基本4公式、パーセントとパーセントポイントの違い、20%引き+10%引きが30%引きにならない理由、税込価格から税額を求める方法を解説します。
ガイドを読む →
AIで作る

このツールをAIで自作してみましょう

自分用のバージョンが必要なら、作業指示プロンプトをAIチャットに貼り付けるか、スキルファイルをAIコーディングエージェントに保存してください。私たちが開発時に整理した機能、例外、テストケースが含まれています。

プロンプトとスキルは英語で提供しています。AIツールはどの言語でもよく理解できます。

AI作業指示プロンプト

Claude、ChatGPT、GeminiなどのAIチャットにそのまま貼り付けてください。

You are an experienced full-stack web developer. Build a web tool called "パーセント計算機" that meets the requirements below.

## Goal

Build a calculator for everyday percentage tasks: share, percent change, increases/decreases and reverse calculations.

## Core features

- What is B% of A
- A is what percent of B
- Percent change from A to B
- Increase or decrease A by B%
- Original price from a discounted price

## Inputs

- Two numbers per calculation type

## Outputs

- Result
- Formula and working shown step by step

## Edge cases and handling rules

- Explain division by zero when the base is 0
- Support negative and decimal numbers
- Rounding option to hide floating-point noise
- Note on percent versus percentage points

## Implementation requirements

- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.
- Make the UI responsive and easy to use on mobile; label every input and keep everything keyboard accessible.
- Add a Copy button for results and show clear, friendly error messages for invalid input.
- Keep the core logic in functions separate from the UI so it can be unit-tested.

## Definition of done (test cases)

- 15% of 80000 = 12000
- Change from 200 to 250 = 25%
- If 72000 is 20% off, the original is 90000

First outline your implementation plan in at most five lines, then write the complete code, and finally explain how to check the test cases above.

スキル (SKILL.md)

Claude CodeなどのAIコーディングエージェントで .claude/skills/build-percent-calculator/SKILL.md に保存すると、このツールを作る・直すたびに再利用できます。

---
name: build-percent-calculator
description: Use when building or changing a パーセント計算機 tool. Build a calculator for everyday percentage tasks: share, percent change, increases/decreases and reverse calculations.
---

# Build: パーセント計算機

## Goal

Build a calculator for everyday percentage tasks: share, percent change, increases/decreases and reverse calculations.

## Workflow

1. Review the required features, inputs and outputs below and ask about anything missing first.
2. Implement the core logic as pure functions separate from the UI.
3. Check the logic against the test cases in the verification list.
4. Build a responsive UI with an input form, a result area and a Copy button.
5. Reproduce each edge case listed under Rules and refine the error messages.

## Core features

- What is B% of A
- A is what percent of B
- Percent change from A to B
- Increase or decrease A by B%
- Original price from a discounted price

## Inputs

- Two numbers per calculation type

## Outputs

- Result
- Formula and working shown step by step

## Rules

- Explain division by zero when the base is 0
- Support negative and decimal numbers
- Rounding option to hide floating-point noise
- Note on percent versus percentage points
- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.

## Verification

- [ ] 15% of 80000 = 12000
- [ ] Change from 200 to 250 = 25%
- [ ] If 72000 is 20% off, the original is 90000

AIに任せるときのコツ

  • 最初の行に使用技術(React、Vue、素のHTMLなど)を書くと、プロジェクトに合ったコードになります。
  • コードを受け取る前に、テストケースを実行して結果を見せるよう依頼しましょう。
  • 本物のパスワード、顧客データ、APIキーは入力せず、サンプル値を使ってください。