V 25 DTF Pricing Calculator
About this app
A vibrant and interactive DTF pricing calculator app that allows users to calculate pricing with different input parameters. Version 25.
V 25 DTF Pricing Calculator V 25 DTF Pricing Calculator 💵 Cost per Item: $ Quantity: Calculate Pricing
Related apps
Put this on your site
Source
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>V 25 DTF Pricing Calculator</title>
<meta name="description" content="A vibrant and interactive DTF pricing calculator app that allows users to calculate pricing with different input parameters. Version 25.">
<meta name="keywords" content="DTF, pricing calculator, interactive app, colorful app, version 25, pricing, budgeting">
<style>
body {
background: linear-gradient(to right, #ffbb33, #ff3488);
color: white;
font-family: 'Poppins', sans-serif;
text-align: center;
}
#main-container {
margin-top: 50px;
}
input[type="number"] {
width: 80px;
margin: 0 10px;
}
.result {
font-size: 24px;
margin-top: 20px;
border: 2px solid white;
padding: 15px;
border-radius: 10px;
background-color: rgba(255, 255, 255, 0.1);
}
.btn {
background-color: #337ab7;
border: none;
}
.btn:hover {
background-color: #286090;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>V 25 DTF Pricing Calculator 💵</h1>
<div>
<label>Cost per Item: $</label>
<input type="number" id="cost" placeholder="0" />
</div>
<div>
<label>Quantity:</label>
<input type="number" id="quantity" placeholder="0" />
</div>
<button id="calculate" class="btn btn-primary">Calculate Pricing</button>
<div class="result" id="result"></div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
const calculateButton = document.getElementById("calculate");
const resultDisplay = document.getElementById("result");
calculateButton.onclick = function() {
const cost = parseFloat(document.getElementById("cost").value) || 0;
const quantity = parseInt(document.getElementById("quantity").value) || 0;
const total = (cost * quantity).toFixed(2);
resultDisplay.innerText = `Total Price: $${total}`;
};
});
</script>
</body>
</html>
NEW APPS
These are apps made by the community!