<!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fit Chef Fred Calorie Calculator</title>
<style>
body {
font-family: 'Arial', sans-serif;
padding: 20px;
background-color: #f4f4f4;
margin: 0;
color: #333;
}
h1 {
text-align: center;
color: #007BFF;
}
.container {
background: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
max-width: 800px;
margin: 0 auto;
}
.input-group {
display: flex;
flex-direction: column;
margin-bottom: 20px;
}
label {
margin-bottom: 5px;
font-weight: bold;
}
input, select {
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 16px;
}
input[type="number"] {
width: calc(100% - 22px);
}
select {
width: 100%;
margin-top: 5px;
}
button {
background-color: #007BFF;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #0056b3;
}
.result {
margin-top: 20px;
padding: 20px;
background: #e9ecef;
border: 1px solid #ddd;
border-radius: 8px;
}
.warning {
color: #dc3545;
font-weight: bold;
}
.important {
color: #dc3545;
font-weight: bold;
}
.explanation {
font-style: italic;
}
</style>
</head>
<body>
<h1>Fit Chef Fred Calorie Calculator</h1>
<div class="container">
<p class="important">The tool is a helpful guide but is not a substitute for
personalized medical or nutritional advice. Users with specific health conditions or
unique dietary needs should seek advice from healthcare professionals.</p>
<p>Refeed days can help prevent metabolic slowdown, replenish glycogen
stores, and provide a mental break from the restrictive nature of dieting, supporting
long-term adherence to your weight loss plan.</p>
<div class="input-group">
<label for="age">Age</label>
<input type="number" id="age" placeholder="Enter your age">
</div>
<div class="input-group">
<label for="gender">Gender</label>
<select id="gender">
<option value="M">Male</option>
<option value="F">Female</option>
</select>
</div>
<div class="input-group">
<label for="height">Height</label>
<input type="number" id="height" placeholder="Height in cm">
<select id="heightUnit">
<option value="cm">cm</option>
<option value="ft">Feet & Inches</option>
</select>
<div id="heightInputs" style="display: none;">
<input type="number" id="heightFeet" placeholder="Feet">
<input type="number" id="heightInches" placeholder="Inches">
</div>
</div>
<div class="input-group">
<label for="weight">Weight</label>
<input type="number" id="weight" placeholder="Weight">
<select id="weightUnit">
<option value="kg">kg</option>
<option value="lbs">lbs</option>
</select>
</div>
<div class="input-group">
<label for="activityLevel">Activity Level</label>
<select id="activityLevel">
<option value="0">Sedentary (little or no exercise, desk
job)</option>
<option value="1">Lightly Active (light exercise 1-3 days/week,
mostly sedentary job)</option>
<option value="2">Moderately Active (moderate exercise 3-5
days/week or active job)</option>
<option value="3">Very Active (hard exercise 6-7 days/week or
physically demanding job)</option>
<option value="4">Super Active (very hard exercise/sports &
physical job)</option>
</select>
</div>
<div class="input-group">
<label for="weightLossGoal">Weight Loss Goal</label>
<select id="weightLossGoal">
<option value="0.25">0.25 kg per week</option>
<option value="0.5">0.5 kg per week</option>
<option value="0.75">0.75 kg per week</option>
<option value="1">1 kg per week</option>
</select>
</div>
<div class="input-group">
<label for="refeedDays">Refeed Days</label>
<select id="refeedDays">
<option value="0">No refeed days</option>
<option value="1">1 refeed day</option>
<option value="3">3 refeed days</option>
</select>
</div>
<button onclick="calculate()">Calculate</button>
<div class="result" id="result"></div>
</div>
<script>
document.getElementById('heightUnit').addEventListener('change',
function() {
const heightInput = document.getElementById('height');
const heightInputs = document.getElementById('heightInputs');
const weightLossGoal = document.getElementById('weightLossGoal');
const weightUnit = document.getElementById('weightUnit');
if (this.value === 'ft') {
heightInput.style.display = 'none';
heightInputs.style.display = 'block';
weightLossGoal.innerHTML = `
<option value="0.5">1 lb per week</option>
<option value="1">2 lbs per week</option>
`;
weightUnit.value = 'lbs';
} else {
heightInput.style.display = 'block';
heightInputs.style.display = 'none';
weightLossGoal.innerHTML = `
<option value="0.25">0.25 kg per week</option>
<option value="0.5">0.5 kg per week</option>
<option value="0.75">0.75 kg per week</option>
<option value="1">1 kg per week</option>
`;
weightUnit.value = 'kg';
}
});
function calculate() {
const age = parseInt(document.getElementById('age').value) || 0;
const gender = document.getElementById('gender').value;
let height = parseFloat(document.getElementById('height').value) || 0;
const heightUnit = document.getElementById('heightUnit').value;
let weight = parseFloat(document.getElementById('weight').value) || 0;
const weightUnit = document.getElementById('weightUnit').value;
const activityLevel =
parseInt(document.getElementById('activityLevel').value) || 0;
const weightLossGoal =
parseFloat(document.getElementById('weightLossGoal').value) || 0.25;
const refeedDays =
parseInt(document.getElementById('refeedDays').value) || 0;
const isImperial = heightUnit === 'ft';
// Convert height to cm
if (isImperial) {
const feet =
parseFloat(document.getElementById('heightFeet').value) || 0;
const inches =
parseFloat(document.getElementById('heightInches').value) || 0;
height = (feet * 30.48) + (inches * 2.54); // Convert feet and inches to
cm
}
// Convert weight to kg
if (weightUnit === 'lbs') {
weight *= 0.453592; // Convert lbs to kg
}
if (age <= 0 || height <= 0 || weight <= 0) {
alert("Please enter valid positive values for age, height, and
weight.");
return;
}
const bmr = calculateBMR(age, gender, height, weight);
const tdee = calculateCalorieGoal(bmr, activityLevel);
const healthyWeightRange = calculateHealthyWeightRange(height);
const deficitPerKg = 7700;
const weeklyDeficit = weightLossGoal * deficitPerKg;
const dailyDeficit = weeklyDeficit / 7;
let calorieGoal = tdee - dailyDeficit;
if (calorieGoal < bmr) {
calorieGoal = bmr;
}
const minCalories = gender === 'M' ? 1500 : 1200;
calorieGoal = Math.max(calorieGoal, minCalories);
let refeedCalories, dailyIntakeWithRefeeds;
if (refeedDays === 1) {
refeedCalories = calorieGoal * 1.2;
dailyIntakeWithRefeeds = (calorieGoal * 6 + refeedCalories) / 7;
} else if (refeedDays === 3) {
refeedCalories = calorieGoal + 250;
dailyIntakeWithRefeeds = (calorieGoal * 4 + refeedCalories * 3) / 7;
} else {
refeedCalories = calorieGoal;
dailyIntakeWithRefeeds = calorieGoal;
}
const proteinIntake = calculateProteinIntake(weight, height,
calculateBMI(height, weight), activityLevel, dailyIntakeWithRefeeds);
const macros = calculateMacros(dailyIntakeWithRefeeds,
proteinIntake.avg);
const refeedMacros = calculateMacros(refeedCalories,
proteinIntake.avg);
const actualWeeklyDeficit = (tdee * 7) - (dailyIntakeWithRefeeds * 7);
const potentialWeightLoss = actualWeeklyDeficit / deficitPerKg;
let resultText = `
<p><strong>BMR:</strong> ${bmr.toFixed(2)} kcal/day</p>
<p><strong>TDEE (Calories to maintain current weight):</strong> $
{tdee.toFixed(2)} kcal/day</p>
<p><strong>Calorie Goal for Weight Loss:</strong> $
{calorieGoal.toFixed(2)} kcal/day</p>
`;
if (refeedDays > 0) {
resultText += `<p><strong>Refeed Day Calorie Intake:</strong> $
{refeedCalories.toFixed(2)} kcal/day</p>`;
}
resultText += `
<p><strong>BMI:</strong> ${calculateBMI(height,
weight).toFixed(2)}</p>
<p><strong>Healthy BMI Range (18.5-24.9):</strong> $
{formatWeight(healthyWeightRange[0], isImperial)} - $
{formatWeight(healthyWeightRange[1], isImperial)}</p>
<p><strong>Potential Weight Loss:</strong> $
{formatWeight(potentialWeightLoss, isImperial)}/week</p>
<p><strong>Calculated Average Protein Intake:</strong> $
{proteinIntake.avg.toFixed(2)} g/day</p>
<p><strong>Macro Breakdown (Non-Refeed Days):</strong></p>
<ul>
<li>Protein: ${formatMacro(macros.protein)}/day ($
{((macros.protein * 4) / calorieGoal * 100).toFixed(2)}%)</li>
<li>Carbohydrates: ${formatMacro(macros.carbs)}/day ($
{((macros.carbs * 4) / calorieGoal * 100).toFixed(2)}%)</li>
<li>Fats: ${formatMacro(macros.fats)}/day (${((macros.fats * 9) /
calorieGoal * 100).toFixed(2)}%)</li>
</ul>
`;
if (refeedDays > 0) {
resultText += `
<p><strong>Macro Breakdown (Refeed Days):</strong></p>
<ul>
<li>Protein: ${formatMacro(refeedMacros.protein)}/day ($
{((refeedMacros.protein * 4) / refeedCalories * 100).toFixed(2)}%)</li>
<li>Carbohydrates:
${formatMacro(refeedMacros.carbs)}/day (${((refeedMacros.carbs * 4) /
refeedCalories * 100).toFixed(2)}%)</li>
<li>Fats: ${formatMacro(refeedMacros.fats)}/day ($
{((refeedMacros.fats * 9) / refeedCalories * 100).toFixed(2)}%)</li>
</ul>
`;
}
resultText += `
<p class="explanation">High protein intake helps to preserve muscle
mass during weight loss, supports recovery, and promotes overall metabolic
health.</p>
`;
if (calorieGoal === bmr) {
resultText += `
<p class="explanation">The potential weight loss is lower than
your goal because reducing your calorie intake below your Basal Metabolic Rate
(BMR) is not safe.
Eating below your BMR can lead to muscle loss, nutrient
deficiencies, and other health problems. Therefore, the calorie goal has been
adjusted to ensure it remains at your BMR.</p>
`;
} else if (calorieGoal < tdee) {
resultText += `
<p class="explanation">Your calorie goal is set below your Total
Daily Energy Expenditure (TDEE) to create a calorie deficit for weight loss.
This deficit is designed to promote gradual, sustainable weight
loss while still providing enough energy for your body's basic functions and daily
activities.</p>
`;
} else {
resultText += `
<p class="explanation">Your calorie goal is set at your Total
Daily Energy Expenditure (TDEE). This will maintain your current weight.
If you want to lose weight, consider lowering your calorie intake
or increasing your activity level to create a calorie deficit.</p>
`;
}
if (refeedDays === 1) {
resultText += `
<p class="explanation">Your refeed day provides a 20%
increase in calories, which can help prevent metabolic slowdown and provide a
mental break from dieting.</p>
<p><strong>Refeed Day
Breakdown:</strong></p>
<ul>
<li>Monday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Tuesday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Wednesday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Thursday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Friday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Saturday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Sunday (Refeed): ${refeedCalories.toFixed(2)} kcal</li>
</ul>
`;
} else if (refeedDays === 3) {
resultText += `
<p class="explanation">Your 3 refeed days each provide an
extra 250 calories. People often choose weekends (Friday, Saturday, and Sunday)
for refeed days, but you can adjust this to fit your schedule.</p>
<p><strong>Refeed Day Breakdown:</strong></p>
<ul>
<li>Monday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Tuesday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Wednesday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Thursday: ${calorieGoal.toFixed(2)} kcal</li>
<li>Friday (Refeed): ${refeedCalories.toFixed(2)} kcal</li>
<li>Saturday (Refeed): ${refeedCalories.toFixed(2)} kcal</li>
<li>Sunday (Refeed): ${refeedCalories.toFixed(2)} kcal</li>
</ul>
`;
}
resultText += `
<p class="explanation">To help track your nutrient needs and calorie
intake, consider using apps like Yazio, My Fitness Pal, or Lose It. You can enter the
macro breakdown from this tool as custom values in these apps for better tracking of
your weight loss journey.</p>
`;
if (calorieGoal === minCalories) {
resultText += `<p class="warning">Note: Your calorie goal has been
set to the minimum of ${minCalories} calories per day for safe weight loss.</p>`;
}
document.getElementById('result').innerHTML = resultText;
}
function calculateBMR(age, gender, height, weight) {
if (gender === 'M') {
return 10 * weight + 6.25 * height - 5 * age + 5;
} else {
return 10 * weight + 6.25 * height - 5 * age - 161;
}
}
function calculateCalorieGoal(bmr, activityLevel) {
const activityMultipliers = [1.2, 1.375, 1.55, 1.725, 1.9];
return bmr * activityMultipliers[activityLevel];
}
function calculateBMI(height, weight) {
return weight / ((height / 100) ** 2);
}
function calculateHealthyWeightRange(height) {
const minBMI = 18.5;
const maxBMI = 24.9;
const heightInMeters = height / 100;
return [
minBMI * (heightInMeters ** 2),
maxBMI * (heightInMeters ** 2)
];
}
function calculateProteinIntake(weight, height, bmi, activityLevel,
dailyCalories) {
let minProteinFactor, maxProteinFactor;
if (bmi > 30) {
const proteinCalories = dailyCalories * 0.35;
const proteinGrams = proteinCalories / 4;
return {
min: proteinGrams,
max: proteinGrams,
avg: proteinGrams
};
}
if (activityLevel >= 3) {
minProteinFactor = 2.2;
maxProteinFactor = 3.4;
} else {
minProteinFactor = 1.6;
maxProteinFactor = 2.2;
}
const minProtein = weight * minProteinFactor;
const maxProtein = weight * maxProteinFactor;
return {
min: minProtein,
max: maxProtein,
avg: (minProtein + maxProtein) / 2
};
}
function calculateMacros(calorieIntake, proteinIntake) {
const proteinCalories = proteinIntake * 4;
const fatCalories = calorieIntake * 0.25;
const carbCalories = calorieIntake - proteinCalories - fatCalories;
return {
protein: proteinIntake,
carbs: carbCalories / 4,
fats: fatCalories / 9
};
}
function formatWeight(weight, isImperial) {
if (isImperial) {
return (weight * 2.20462).toFixed(2) + ' lbs';
} else {
return weight.toFixed(2) + ' kg';
}
}
function formatMacro(value) {
return value.toFixed(2) + ' g';
}
</script>
</body>
</html>
