{"product_id":"markup","title":"Markup Calculator","description":"\u003cstyle\u003e\n.mk-calculator {\n  --ink: #0f172a;\n  --muted: #475569;\n  --border: #e2e8f0;\n  --surface: #ffffff;\n  --tint: #f8fafc;\n  --primary: #1d4ed8;\n  --accent: #c2410c;\n  --accent-hover: #9a3412;\n  --chart-1: #1e40af;\n  --chart-2: #0d9488;\n  --chart-3: #7c3aed;\n  --chart-4: #be185d;\n  --chart-5: #334155;\n  --danger: #b91c1c;\n  --success: #166534;\n  width: 100%;\n  max-width: 1200px;\n  margin: 0 auto;\n  color: var(--ink);\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n  font-size: 15px;\n  line-height: 1.6;\n  container-type: inline-size;\n  container-name: mkcalc;\n}\n.mk-calculator,\n.mk-calculator *,\n.mk-calculator *::before,\n.mk-calculator *::after {\n  box-sizing: border-box;\n}\n.mk-calculator a {\n  color: var(--primary);\n  text-decoration-thickness: 1px;\n  text-underline-offset: 2px;\n}\n.mk-calculator a:hover {\n  text-decoration-thickness: 2px;\n}\n.mk-calculator button,\n.mk-calculator input,\n.mk-calculator select {\n  font: inherit;\n}\n.mk-calculator button,\n.mk-calculator select,\n.mk-calculator input {\n  min-height: 44px;\n}\n.mk-calculator button {\n  cursor: pointer;\n}\n.mk-calculator button:focus-visible,\n.mk-calculator input:focus-visible,\n.mk-calculator select:focus-visible,\n.mk-calculator a:focus-visible {\n  outline: 3px solid rgba(29, 78, 216, .38);\n  outline-offset: 2px;\n}\n.mk-calculator .mk-shell {\n  display: grid;\n  gap: 24px;\n  min-width: 0;\n}\n.mk-calculator .mk-header {\n  display: grid;\n  gap: 12px;\n  min-width: 0;\n  padding: 24px;\n  border: 1px solid var(--border);\n  border-radius: 8px;\n  background: linear-gradient(180deg, var(--surface), var(--tint));\n  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);\n}\n.mk-calculator .mk-title {\n  margin: 0;\n  font-size: 24px;\n  line-height: 1.25;\n  font-weight: 700;\n  letter-spacing: -.02em;\n}\n.mk-calculator .mk-subtitle {\n  margin: 0;\n  max-width: 760px;\n  color: var(--muted);\n}\n.mk-calculator .mk-pills {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n  min-width: 0;\n}\n.mk-calculator .mk-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  min-width: 0;\n  padding: 5px 9px;\n  border: 1px solid var(--border);\n  border-radius: 999px;\n  background: var(--surface);\n  color: var(--muted);\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 1.35;\n}\n.mk-calculator .mk-pill strong {\n  color: var(--ink);\n  font-variant-numeric: tabular-nums;\n}\n.mk-calculator .mk-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 12px;\n  min-width: 0;\n}\n.mk-calculator .mk-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  min-width: 0;\n  border: 1px solid transparent;\n  border-radius: 6px;\n  padding: 11px 18px;\n  font-weight: 650;\n  line-height: 1.25;\n  white-space: nowrap;\n  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;\n}\n.mk-calculator .mk-button:hover {\n  box-shadow: 0 3px 8px rgba(15, 23, 42, .12);\n  transform: translateY(-1px);\n}\n.mk-calculator .mk-button:active {\n  transform: translateY(0);\n}\n.mk-calculator .mk-button-primary {\n  background: var(--accent);\n  color: #ffffff;\n  border-color: var(--accent);\n}\n.mk-calculator .mk-button-primary:hover {\n  background: var(--accent-hover);\n  border-color: var(--accent-hover);\n}\n.mk-calculator .mk-button-secondary {\n  background: var(--surface);\n  color: var(--ink);\n  border-color: #cbd5e1;\n}\n.mk-calculator .mk-button-secondary:hover {\n  background: var(--tint);\n  border-color: #94a3b8;\n}\n.mk-calculator .mk-icon {\n  width: 18px;\n  height: 18px;\n  flex: 0 0 auto;\n}\n.mk-calculator .mk-workspace {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  gap: 24px;\n  min-width: 0;\n  align-items: start;\n}\n.mk-calculator .mk-panel,\n.mk-calculator .mk-section {\n  min-width: 0;\n  border: 1px solid var(--border);\n  border-radius: 8px;\n  background: var(--surface);\n  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);\n}\n.mk-calculator .mk-panel {\n  padding: 20px;\n}\n.mk-calculator .mk-section {\n  padding: 24px;\n}\n.mk-calculator .mk-panel-heading,\n.mk-calculator .mk-section-heading {\n  margin: 0;\n  font-size: 18px;\n  line-height: 1.35;\n  font-weight: 650;\n}\n.mk-calculator .mk-panel-intro,\n.mk-calculator .mk-section-intro {\n  margin: 6px 0 0;\n  color: var(--muted);\n}\n.mk-calculator .mk-form {\n  display: grid;\n  gap: 16px;\n  margin-top: 20px;\n  min-width: 0;\n}\n.mk-calculator .mk-field {\n  display: grid;\n  grid-template-rows: auto auto minmax(36px, auto);\n  gap: 6px;\n  min-width: 0;\n}\n.mk-calculator .mk-label-row {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: baseline;\n  gap: 8px;\n  min-width: 0;\n}\n.mk-calculator .mk-label {\n  font-size: 14px;\n  line-height: 1.4;\n  font-weight: 600;\n  color: var(--ink);\n}\n.mk-calculator .mk-status-badge {\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 7px;\n  border-radius: 999px;\n  background: #e0e7ff;\n  color: #3730a3;\n  font-size: 13px;\n  font-weight: 600;\n  line-height: 1.35;\n}\n.mk-calculator .mk-control {\n  width: 100%;\n  min-width: 0;\n  border: 1px solid #cbd5e1;\n  border-radius: 6px;\n  padding: 9px 11px;\n  background: var(--surface);\n  color: var(--ink);\n  font-size: 15px;\n  line-height: 1.4;\n  font-variant-numeric: tabular-nums;\n  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;\n}\n.mk-calculator .mk-control:hover {\n  border-color: #94a3b8;\n}\n.mk-calculator .mk-control[readonly] {\n  background: var(--tint);\n  color: #334155;\n  border-style: dashed;\n}\n.mk-calculator .mk-control[aria-invalid=\"true\"] {\n  border-color: var(--danger);\n  box-shadow: 0 0 0 2px rgba(185, 28, 28, .12);\n}\n.mk-calculator .mk-helper {\n  margin: 0;\n  color: var(--muted);\n  font-size: 13px;\n  line-height: 1.45;\n  font-weight: 500;\n}\n.mk-calculator .mk-helper-error {\n  color: var(--danger);\n}\n.mk-calculator .mk-result-grid {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 12px;\n  margin-top: 20px;\n  min-width: 0;\n}\n.mk-calculator .mk-result-card {\n  display: grid;\n  align-content: start;\n  gap: 4px;\n  min-width: 0;\n  padding: 16px;\n  border: 1px solid var(--border);\n  border-radius: 8px;\n  background: var(--tint);\n}\n.mk-calculator .mk-result-card-primary {\n  grid-column: 1 \/ -1;\n  background: #eff6ff;\n  border-color: #bfdbfe;\n}\n.mk-calculator .mk-result-label {\n  color: var(--muted);\n  font-size: 13px;\n  line-height: 1.35;\n  font-weight: 600;\n}\n.mk-calculator .mk-result-value {\n  min-width: 0;\n  color: var(--ink);\n  font-size: 20px;\n  line-height: 1.2;\n  font-weight: 700;\n  letter-spacing: -.015em;\n  font-variant-numeric: tabular-nums;\n  overflow-wrap: anywhere;\n}\n.mk-calculator .mk-result-card-primary .mk-result-value {\n  font-size: 30px;\n}\n.mk-calculator .mk-result-note {\n  margin: 2px 0 0;\n  color: var(--muted);\n  font-size: 13px;\n  line-height: 1.45;\n  font-weight: 500;\n}\n.mk-calculator .mk-live {\n  margin-top: 16px;\n  padding: 10px 12px;\n  border-left: 3px solid var(--primary);\n  border-radius: 0 6px 6px 0;\n  background: #eff6ff;\n  color: #1e3a8a;\n  font-size: 13px;\n  font-weight: 600;\n}\n.mk-calculator .mk-chart-card {\n  display: grid;\n  gap: 20px;\n  min-width: 0;\n}\n.mk-calculator .mk-chart-cluster {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  justify-content: center;\n  justify-items: center;\n  gap: 20px;\n  min-width: 0;\n}\n.mk-calculator .mk-chart-visual {\n  display: grid;\n  place-items: center;\n  width: min(100%, 320px);\n  min-width: 0;\n}\n.mk-calculator .mk-chart-svg {\n  display: block;\n  width: min(100%, 300px);\n  height: auto;\n  aspect-ratio: 1;\n  overflow: visible;\n}\n.mk-calculator .mk-chart-legend {\n  display: grid;\n  align-content: center;\n  gap: 10px;\n  width: min(100%, 360px);\n  min-width: 0;\n}\n.mk-calculator .mk-legend-row {\n  display: grid;\n  grid-template-columns: 14px minmax(0, max-content) minmax(0, max-content) minmax(0, max-content);\n  align-items: center;\n  justify-content: start;\n  column-gap: 10px;\n  row-gap: 4px;\n  min-width: 0;\n  padding: 8px 0;\n  border-bottom: 1px solid var(--border);\n}\n.mk-calculator .mk-legend-row:last-child {\n  border-bottom: 0;\n}\n.mk-calculator .mk-legend-swatch {\n  width: 12px;\n  height: 12px;\n  border-radius: 3px;\n  border: 1px solid rgba(15, 23, 42, .16);\n}\n.mk-calculator .mk-legend-name,\n.mk-calculator .mk-legend-value,\n.mk-calculator .mk-legend-share {\n  font-size: 13px;\n  line-height: 1.4;\n  font-weight: 600;\n  font-variant-numeric: tabular-nums;\n}\n.mk-calculator .mk-legend-name {\n  color: var(--ink);\n}\n.mk-calculator .mk-legend-value,\n.mk-calculator .mk-legend-share {\n  color: var(--muted);\n}\n.mk-calculator .mk-chart-empty {\n  width: min(100%, 520px);\n  padding: 16px;\n  border: 1px dashed #94a3b8;\n  border-radius: 6px;\n  background: var(--tint);\n  color: var(--muted);\n  text-align: center;\n  font-size: 13px;\n  font-weight: 600;\n}\n.mk-calculator .mk-chart-callout,\n.mk-calculator .mk-table-note {\n  min-width: 0;\n  margin-top: 16px;\n  padding: 10px 12px;\n  border: 1px solid var(--border);\n  border-radius: 6px;\n  background: var(--tint);\n  color: var(--muted);\n  font-size: 13px;\n  line-height: 1.5;\n  font-weight: 500;\n}\n.mk-calculator .mk-safe-chart-stack .mk-chart-cluster {\n  grid-template-columns: minmax(0, 1fr) !important;\n  row-gap: 24px !important;\n}\n.mk-calculator .mk-safe-chart-stack .mk-chart-legend {\n  margin-top: 0;\n}\n.mk-calculator .mk-safe-chart-stack .mk-chart-callout {\n  margin-top: 20px;\n}\n.mk-calculator .mk-table-wrap {\n  width: 100%;\n  min-width: 0;\n  margin-top: 20px;\n  overflow-x: auto;\n  border: 1px solid var(--border);\n  border-radius: 6px;\n  background: var(--surface);\n}\n.mk-calculator .mk-table {\n  width: 100%;\n  min-width: 620px;\n  border-collapse: collapse;\n  font-variant-numeric: tabular-nums;\n}\n.mk-calculator .mk-table th,\n.mk-calculator .mk-table td {\n  padding: 11px 12px;\n  border-bottom: 1px solid var(--border);\n  text-align: right;\n  vertical-align: middle;\n}\n.mk-calculator .mk-table th:first-child,\n.mk-calculator .mk-table td:first-child {\n  text-align: left;\n}\n.mk-calculator .mk-table th {\n  background: #0f274a;\n  color: #ffffff;\n  font-size: 13px;\n  font-weight: 700;\n  letter-spacing: .01em;\n}\n.mk-calculator .mk-table td {\n  color: var(--ink);\n  font-size: 14px;\n}\n.mk-calculator .mk-table tbody tr:hover {\n  background: #f8fafc;\n}\n.mk-calculator .mk-table tbody tr:last-child td {\n  border-bottom: 0;\n}\n.mk-calculator .mk-safe-table-stack .mk-table-wrap {\n  height: auto !important;\n  max-height: none !important;\n}\n.mk-calculator .mk-safe-table-stack .mk-table-note {\n  margin-top: 20px;\n}\n.mk-calculator .mk-education {\n  display: grid;\n  gap: 24px;\n  min-width: 0;\n}\n.mk-calculator .mk-education-section {\n  min-width: 0;\n}\n.mk-calculator .mk-education h2 {\n  margin: 0 0 10px;\n  font-size: 22px;\n  line-height: 1.3;\n  font-weight: 700;\n  letter-spacing: -.015em;\n}\n.mk-calculator .mk-education h3 {\n  margin: 18px 0 6px;\n  font-size: 17px;\n  line-height: 1.4;\n  font-weight: 650;\n}\n.mk-calculator .mk-education p {\n  margin: 0 0 12px;\n  color: #334155;\n}\n.mk-calculator .mk-education p:last-child {\n  margin-bottom: 0;\n}\n.mk-calculator .mk-formula {\n  padding: 12px 14px;\n  border-left: 3px solid var(--chart-2);\n  border-radius: 0 6px 6px 0;\n  background: #f0fdfa;\n  color: #134e4a;\n  font-weight: 600;\n  font-variant-numeric: tabular-nums;\n}\n.mk-calculator .mk-visually-hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n@container mkcalc (min-width: 640px) {\n  .mk-calculator .mk-chart-cluster {\n    grid-template-columns: minmax(220px, 320px) minmax(240px, 360px);\n    align-items: center;\n    justify-items: stretch;\n    column-gap: 24px;\n  }\n}\n@container mkcalc (min-width: 900px) {\n  .mk-calculator .mk-workspace {\n    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);\n  }\n}\n@container mkcalc (max-width: 420px) {\n  .mk-calculator .mk-header,\n  .mk-calculator .mk-panel,\n  .mk-calculator .mk-section {\n    padding: 16px;\n  }\n  .mk-calculator .mk-result-grid {\n    grid-template-columns: minmax(0, 1fr);\n  }\n  .mk-calculator .mk-result-card-primary {\n    grid-column: auto;\n  }\n  .mk-calculator .mk-button {\n    width: 100%;\n  }\n  .mk-calculator .mk-legend-row {\n    grid-template-columns: 14px minmax(0, 1fr) minmax(0, max-content);\n  }\n  .mk-calculator .mk-legend-share {\n    grid-column: 2 \/ -1;\n  }\n}\n\u003c\/style\u003e\n\u003cdiv class=\"mk-calculator\" data-calculator-root\u003e\n  \u003cdiv class=\"mk-shell\"\u003e\n    \u003csection class=\"mk-header\" aria-labelledby=\"mk-title\"\u003e\n      \u003ch2 class=\"mk-title\" id=\"mk-title\"\u003eMarkup Calculator\u003c\/h2\u003e\n      \u003cp class=\"mk-subtitle\"\u003eTurn any two known pricing figures into a complete per-unit pricing picture, including selling price, profit, markup, gross margin, and scalable quantity scenarios.\u003c\/p\u003e\n      \u003cdiv class=\"mk-pills\" aria-label=\"Live calculation summary\"\u003e\n        \u003cspan class=\"mk-pill\"\u003eBasis \u003cstrong class=\"mk-pill-mode\"\u003eCost + markup\u003c\/strong\u003e\u003c\/span\u003e\n        \u003cspan class=\"mk-pill\"\u003ePrice multiple \u003cstrong class=\"mk-pill-multiple\"\u003e1.40×\u003c\/strong\u003e\u003c\/span\u003e\n        \u003cspan class=\"mk-pill\"\u003eGross margin \u003cstrong class=\"mk-pill-margin\"\u003e28.57%\u003c\/strong\u003e\u003c\/span\u003e\n        \u003cspan class=\"mk-pill\"\u003eUnit profit \u003cstrong class=\"mk-pill-profit\"\u003e$20.00\u003c\/strong\u003e\u003c\/span\u003e\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003cdiv class=\"mk-toolbar\" aria-label=\"Calculator actions\"\u003e\n      \u003cbutton class=\"mk-button mk-button-primary mk-download\" type=\"button\"\u003e\n        \u003csvg class=\"mk-icon\" viewbox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\"\u003e\u003cpath fill=\"currentColor\" d=\"M12 3a1 1 0 0 1 1 1v9.59l2.3-2.3a1 1 0 1 1 1.4 1.42l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 1 1 1.4-1.42l2.3 2.3V4a1 1 0 0 1 1-1Zm-7 15a1 1 0 0 1 1 1v1h12v-1a1 1 0 1 1 2 0v2a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1Z\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n        \u003cspan\u003eDownload Excel\u003c\/span\u003e\n      \u003c\/button\u003e\n      \u003cbutton class=\"mk-button mk-button-secondary mk-reset\" type=\"button\"\u003eReset\u003c\/button\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"mk-workspace\"\u003e\n      \u003csection class=\"mk-panel mk-input-panel\" aria-labelledby=\"mk-input-heading\"\u003e\n        \u003ch3 class=\"mk-panel-heading\" id=\"mk-input-heading\"\u003ePricing inputs\u003c\/h3\u003e\n        \u003cp class=\"mk-panel-intro\"\u003eChoose the two figures you know. The other two fields update automatically.\u003c\/p\u003e\n        \u003cdiv class=\"mk-form\"\u003e\n          \u003cdiv class=\"mk-field\"\u003e\n            \u003cdiv class=\"mk-label-row\"\u003e\u003clabel class=\"mk-label\" for=\"mk-mode\"\u003eCalculation basis\u003c\/label\u003e\u003c\/div\u003e\n            \u003cselect class=\"mk-control mk-mode\" id=\"mk-mode\" aria-describedby=\"mk-mode-help\"\u003e\n              \u003coption value=\"cost_markup\"\u003eCost + markup\u003c\/option\u003e\n              \u003coption value=\"cost_revenue\"\u003eCost + revenue\u003c\/option\u003e\n              \u003coption value=\"revenue_markup\"\u003eRevenue + markup\u003c\/option\u003e\n              \u003coption value=\"cost_profit\"\u003eCost + profit\u003c\/option\u003e\n              \u003coption value=\"revenue_profit\"\u003eRevenue + profit\u003c\/option\u003e\n              \u003coption value=\"markup_profit\"\u003eMarkup + profit\u003c\/option\u003e\n            \u003c\/select\u003e\n            \u003cp class=\"mk-helper\" id=\"mk-mode-help\"\u003eSelect the pair available from your product, service, or quote.\u003c\/p\u003e\n          \u003c\/div\u003e\n\n          \u003cdiv class=\"mk-field\"\u003e\n            \u003cdiv class=\"mk-label-row\"\u003e\n\u003clabel class=\"mk-label\" for=\"mk-cost\"\u003eCost\u003c\/label\u003e\u003cspan class=\"mk-status-badge mk-cost-status\"\u003eInput\u003c\/span\u003e\n\u003c\/div\u003e\n            \u003cinput class=\"mk-control mk-money-input mk-cost\" id=\"mk-cost\" name=\"mk-cost\" type=\"text\" inputmode=\"decimal\" value=\"$50.00\" aria-describedby=\"mk-cost-help mk-cost-error\"\u003e\n            \u003cp class=\"mk-helper\" id=\"mk-cost-help\"\u003eDirect per-unit cost or cost of goods sold. Enter zero or more.\u003c\/p\u003e\n            \u003cp class=\"mk-helper mk-helper-error mk-cost-error\" id=\"mk-cost-error\"\u003e\u003c\/p\u003e\n          \u003c\/div\u003e\n\n          \u003cdiv class=\"mk-field\"\u003e\n            \u003cdiv class=\"mk-label-row\"\u003e\n\u003clabel class=\"mk-label\" for=\"mk-markup\"\u003eMarkup\u003c\/label\u003e\u003cspan class=\"mk-status-badge mk-markup-status\"\u003eInput\u003c\/span\u003e\n\u003c\/div\u003e\n            \u003cinput class=\"mk-control mk-percent-input mk-markup\" id=\"mk-markup\" name=\"mk-markup\" type=\"text\" inputmode=\"decimal\" value=\"40.00%\" aria-describedby=\"mk-markup-help mk-markup-error\"\u003e\n            \u003cp class=\"mk-helper\" id=\"mk-markup-help\"\u003eProfit as a percentage of cost. Values above −100% keep revenue nonnegative.\u003c\/p\u003e\n            \u003cp class=\"mk-helper mk-helper-error mk-markup-error\" id=\"mk-markup-error\"\u003e\u003c\/p\u003e\n          \u003c\/div\u003e\n\n          \u003cdiv class=\"mk-field\"\u003e\n            \u003cdiv class=\"mk-label-row\"\u003e\n\u003clabel class=\"mk-label\" for=\"mk-revenue\"\u003eRevenue\u003c\/label\u003e\u003cspan class=\"mk-status-badge mk-revenue-status\"\u003eCalculated\u003c\/span\u003e\n\u003c\/div\u003e\n            \u003cinput class=\"mk-control mk-money-input mk-revenue\" id=\"mk-revenue\" name=\"mk-revenue\" type=\"text\" inputmode=\"decimal\" value=\"$70.00\" readonly aria-describedby=\"mk-revenue-help mk-revenue-error\"\u003e\n            \u003cp class=\"mk-helper\" id=\"mk-revenue-help\"\u003eSelling price collected per unit before taxes or downstream expenses.\u003c\/p\u003e\n            \u003cp class=\"mk-helper mk-helper-error mk-revenue-error\" id=\"mk-revenue-error\"\u003e\u003c\/p\u003e\n          \u003c\/div\u003e\n\n          \u003cdiv class=\"mk-field\"\u003e\n            \u003cdiv class=\"mk-label-row\"\u003e\n\u003clabel class=\"mk-label\" for=\"mk-profit\"\u003eProfit\u003c\/label\u003e\u003cspan class=\"mk-status-badge mk-profit-status\"\u003eCalculated\u003c\/span\u003e\n\u003c\/div\u003e\n            \u003cinput class=\"mk-control mk-money-input mk-profit\" id=\"mk-profit\" name=\"mk-profit\" type=\"text\" inputmode=\"decimal\" value=\"$20.00\" readonly aria-describedby=\"mk-profit-help mk-profit-error\"\u003e\n            \u003cp class=\"mk-helper\" id=\"mk-profit-help\"\u003ePer-unit gross profit: revenue minus direct cost. It may be negative for a loss.\u003c\/p\u003e\n            \u003cp class=\"mk-helper mk-helper-error mk-profit-error\" id=\"mk-profit-error\"\u003e\u003c\/p\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n      \u003c\/section\u003e\n\n      \u003csection class=\"mk-panel mk-results-panel\" aria-labelledby=\"mk-results-heading\"\u003e\n        \u003ch3 class=\"mk-panel-heading\" id=\"mk-results-heading\"\u003eLive results\u003c\/h3\u003e\n        \u003cp class=\"mk-panel-intro\"\u003eAll values use the current calculation basis and full internal precision.\u003c\/p\u003e\n        \u003cdiv class=\"mk-result-grid\"\u003e\n          \u003carticle class=\"mk-result-card mk-result-card-primary\"\u003e\n            \u003cspan class=\"mk-result-label\"\u003eSelling price \/ revenue per unit\u003c\/span\u003e\n            \u003cstrong class=\"mk-result-value mk-result-revenue\"\u003e$70.00\u003c\/strong\u003e\n            \u003cp class=\"mk-result-note\"\u003eCost plus gross profit.\u003c\/p\u003e\n          \u003c\/article\u003e\n          \u003carticle class=\"mk-result-card\"\u003e\n            \u003cspan class=\"mk-result-label\"\u003eGross profit per unit\u003c\/span\u003e\n            \u003cstrong class=\"mk-result-value mk-result-profit\"\u003e$20.00\u003c\/strong\u003e\n            \u003cp class=\"mk-result-note\"\u003eRevenue minus cost.\u003c\/p\u003e\n          \u003c\/article\u003e\n          \u003carticle class=\"mk-result-card\"\u003e\n            \u003cspan class=\"mk-result-label\"\u003eMarkup on cost\u003c\/span\u003e\n            \u003cstrong class=\"mk-result-value mk-result-markup\"\u003e40.00%\u003c\/strong\u003e\n            \u003cp class=\"mk-result-note\"\u003eProfit divided by cost.\u003c\/p\u003e\n          \u003c\/article\u003e\n          \u003carticle class=\"mk-result-card\"\u003e\n            \u003cspan class=\"mk-result-label\"\u003eGross margin\u003c\/span\u003e\n            \u003cstrong class=\"mk-result-value mk-result-margin\"\u003e28.57%\u003c\/strong\u003e\n            \u003cp class=\"mk-result-note\"\u003eProfit divided by revenue.\u003c\/p\u003e\n          \u003c\/article\u003e\n          \u003carticle class=\"mk-result-card\"\u003e\n            \u003cspan class=\"mk-result-label\"\u003ePrice multiple\u003c\/span\u003e\n            \u003cstrong class=\"mk-result-value mk-result-multiple\"\u003e1.40×\u003c\/strong\u003e\n            \u003cp class=\"mk-result-note\"\u003eRevenue divided by cost.\u003c\/p\u003e\n          \u003c\/article\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"mk-live\" aria-live=\"polite\" aria-atomic=\"true\"\u003eAt a $50.00 cost and 40.00% markup, charge $70.00 for $20.00 gross profit per unit.\u003c\/div\u003e\n      \u003c\/section\u003e\n    \u003c\/div\u003e\n\n    \u003csection class=\"mk-section mk-chart-section\" aria-labelledby=\"mk-breakdown-heading\"\u003e\n      \u003cdiv class=\"mk-chart-card\"\u003e\n        \u003cdiv\u003e\n          \u003ch3 class=\"mk-section-heading\" id=\"mk-breakdown-heading\"\u003eSelling price composition\u003c\/h3\u003e\n          \u003cp class=\"mk-section-intro mk-chart-interpretation\"\u003eCost represents 71.43% of the current selling price and gross profit represents 28.57%.\u003c\/p\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"mk-chart-cluster\"\u003e\n          \u003cdiv class=\"mk-chart-visual\" aria-label=\"Selling price composition chart\"\u003e\u003c\/div\u003e\n          \u003cdiv class=\"mk-chart-legend\" aria-label=\"Selling price composition legend\"\u003e\u003c\/div\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"mk-chart-callout mk-chart-summary\"\u003eRevenue of $70.00 is composed of $50.00 cost and $20.00 gross profit.\u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003csection class=\"mk-section mk-table-section\" aria-labelledby=\"mk-table-heading\"\u003e\n      \u003ch3 class=\"mk-section-heading\" id=\"mk-table-heading\"\u003eQuantity pricing ladder\u003c\/h3\u003e\n      \u003cp class=\"mk-section-intro\"\u003eScale the same unit economics across common order quantities.\u003c\/p\u003e\n      \u003cdiv class=\"mk-table-wrap\"\u003e\n        \u003ctable class=\"mk-table\"\u003e\n          \u003cthead\u003e\n            \u003ctr\u003e\n              \u003cth scope=\"col\"\u003eQuantity\u003c\/th\u003e\n              \u003cth scope=\"col\"\u003eTotal cost\u003c\/th\u003e\n              \u003cth scope=\"col\"\u003eTotal revenue\u003c\/th\u003e\n              \u003cth scope=\"col\"\u003eGross profit\u003c\/th\u003e\n              \u003cth scope=\"col\"\u003eGross margin\u003c\/th\u003e\n            \u003c\/tr\u003e\n          \u003c\/thead\u003e\n          \u003ctbody class=\"mk-table-body\"\u003e\u003c\/tbody\u003e\n        \u003c\/table\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"mk-table-note\"\u003eThe ladder assumes constant unit cost and selling price. Volume discounts, shipping, sales tax, payment fees, and fixed overhead are not included.\u003c\/div\u003e\n    \u003c\/section\u003e\n\n    \u003csection class=\"mk-section mk-education\" aria-label=\"Markup calculator guide\"\u003e\n      \u003cdiv class=\"mk-education-section\"\u003e\n        \u003ch2\u003eWhat does this markup calculator estimate?\u003c\/h2\u003e\n        \u003cp\u003eThis calculator completes a four-part pricing relationship: cost, markup, revenue, and profit. You choose any two values you already know, and the calculator derives the remaining figures. The default example uses a $50.00 unit cost and a 40.00% markup, producing a $70.00 selling price and $20.00 of gross profit. The calculations are per unit, so they work for a physical product, a service package, a menu item, a resale quote, or any other offer with a definable direct cost.\u003c\/p\u003e\n        \u003cp\u003eMarkup is not the same as gross margin. Markup compares profit with cost, while margin compares profit with revenue. That distinction matters because a 40% markup produces a 28.57% gross margin, not a 40% margin. For additional background, see Investopedia’s explanation of \u003ca href=\"https:\/\/www.investopedia.com\/ask\/answers\/102714\/whats-difference-between-profit-margin-and-markup.asp\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eprofit margin versus markup\u003c\/a\u003e.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"mk-education-section\"\u003e\n        \u003ch2\u003eHow should each input be used?\u003c\/h2\u003e\n        \u003ch3\u003eCalculation basis\u003c\/h3\u003e\n        \u003cp\u003eThe basis selector tells the calculator which two fields are authoritative. Choose Cost + markup when setting a price from a target markup. Choose Cost + revenue when you already know the selling price and want to measure actual markup. Revenue + markup is useful when a market price is fixed and you need to estimate the maximum cost that supports a target markup. The other three combinations let you solve from a known profit amount. Changing the basis does not change the current economics; it changes which fields are editable.\u003c\/p\u003e\n        \u003ch3\u003eCost\u003c\/h3\u003e\n        \u003cp\u003eCost is the direct amount attributable to one unit. For inventory, this often begins with purchase or manufacturing cost and may include inbound freight or directly attributable handling. It should not automatically include every operating expense. The IRS discusses inventory and cost of goods sold in \u003ca href=\"https:\/\/www.irs.gov\/publications\/p334\" target=\"_blank\" rel=\"noopener noreferrer\"\u003ePublication 334\u003c\/a\u003e, although accounting and tax treatment depends on your facts. A higher cost reduces profit when price is unchanged, or raises the required price when markup is held constant. Cost must be zero or positive.\u003c\/p\u003e\n        \u003ch3\u003eMarkup\u003c\/h3\u003e\n        \u003cp\u003eMarkup is profit divided by cost. Enter 40% when you want profit equal to 40% of cost. A 100% markup doubles cost: a $50 cost becomes a $100 price. Negative markup represents selling below cost. Values must remain above −100% when markup is used to derive revenue, because a markup of −100% would reduce the selling price to zero and lower values would imply negative revenue.\u003c\/p\u003e\n        \u003ch3\u003eRevenue and profit\u003c\/h3\u003e\n        \u003cp\u003eRevenue is the per-unit selling price before sales tax and before expenses that are not included in direct cost. Profit here is gross profit, calculated as revenue minus cost. It is not net income because payroll, rent, marketing, software, financing, taxes, returns, and other overhead may still need to be paid. Profit can be negative, but a chosen pair is invalid when it mathematically produces a negative cost or negative revenue.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"mk-education-section\"\u003e\n        \u003ch2\u003eHow does the pricing formula work?\u003c\/h2\u003e\n        \u003cp class=\"mk-formula\"\u003eProfit = Revenue − Cost\u003cbr\u003eMarkup % = Profit ÷ Cost × 100\u003cbr\u003eGross margin % = Profit ÷ Revenue × 100\u003cbr\u003eRevenue = Cost × (1 + Markup %)\u003c\/p\u003e\n        \u003cp\u003eThese equations are rearranged according to the selected basis. For example, when revenue and markup are known, cost equals revenue divided by one plus the markup rate. When markup and profit are known, cost equals profit divided by the markup rate. The calculator keeps full precision during those rearrangements and rounds only the displayed and exported values.\u003c\/p\u003e\n        \u003cp\u003eZero-cost cases require care. If both cost and profit are zero, markup is treated as zero for a neutral result. If cost is zero but profit is positive, the conventional markup ratio is undefined because it requires division by zero. The calculator avoids displaying infinity and instead keeps the rest of the pricing model finite and readable.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"mk-education-section\"\u003e\n        \u003ch2\u003eHow should the results, chart, and table be interpreted?\u003c\/h2\u003e\n        \u003cp\u003eSelling price is the amount charged per unit. Gross profit is the dollar cushion available after direct cost. Markup indicates how aggressively price is set above cost. Gross margin shows the share of each sales dollar remaining after direct cost, which is often more useful for comparing products with different prices. The price multiple expresses the same relationship as revenue divided by cost: 1.40× corresponds to a 40% markup.\u003c\/p\u003e\n        \u003cp\u003eThe composition chart splits the current selling price into cost and gross profit. It appears only when both components are nonnegative and the selling price is positive. A loss scenario cannot be represented honestly as a positive composition, so the chart switches to a compact explanatory state rather than drawing a misleading ring. The legend and chart summary use the same current model values.\u003c\/p\u003e\n        \u003cp\u003eThe quantity ladder multiplies unit cost, unit revenue, and unit profit by 1, 10, 50, and 100 units. Gross margin remains constant because the table assumes unchanged unit economics. Use the Excel download to capture the current inputs, outputs, breakdown, and quantity scenarios in a real workbook. For broader planning, compare gross profit with fixed operating costs and review the SBA’s guidance on the \u003ca href=\"https:\/\/www.sba.gov\/business-guide\/plan-your-business\/calculate-your-startup-costs\/break-even-point\" target=\"_blank\" rel=\"noopener noreferrer\"\u003ebreak-even point\u003c\/a\u003e.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"mk-education-section\"\u003e\n        \u003ch2\u003eWhat are the main pricing tradeoffs and common mistakes?\u003c\/h2\u003e\n        \u003cp\u003eCost-plus markup is fast and transparent, but it does not prove that customers will accept the resulting price. A higher markup increases unit profit when cost is unchanged, yet it may reduce sales volume. A lower markup can support competitiveness or faster inventory turnover, but it leaves less room for discounts, returns, payment processing, spoilage, and overhead. Test market demand, competitor positioning, and customer value alongside the arithmetic.\u003c\/p\u003e\n        \u003cp\u003eCommon mistakes include confusing markup with margin, omitting freight or transaction costs from direct cost, applying a desired margin as though it were markup, and treating gross profit as net profit. Another frequent error is changing price without checking whether the revised contribution is sufficient to cover fixed costs. Use the calculator as a disciplined starting point, then layer in taxes, discounts, channel fees, overhead, and demand assumptions before making a final commercial decision.\u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/section\u003e\n  \u003c\/div\u003e\n\u003c\/div\u003e","brand":"FinancialModelsLab","offers":[{"title":"Default Title","offer_id":49909480358131,"sku":"markup","price":0.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0522\/6191\/2762\/files\/markup.webp?v=1783935370","url":"https:\/\/financialmodelslab.com\/products\/markup","provider":"Financial Models Lab","version":"1.0","type":"link"}