285 lines
8.8 KiB
HTML
285 lines
8.8 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Basin Pigment Density | Angela Debrow</title>
|
||
<link rel="stylesheet" href="/styles.css">
|
||
<style>
|
||
:root {
|
||
--basin-red: #8B3A3A;
|
||
--ochre: #D4A574;
|
||
--clay: #A0522D;
|
||
--desert-night: #1a0f0f;
|
||
--paper: #f4f1ea;
|
||
}
|
||
body {
|
||
background: var(--desert-night);
|
||
color: var(--paper);
|
||
font-family: 'Georgia', serif;
|
||
margin: 0;
|
||
padding: 2rem;
|
||
line-height: 1.6;
|
||
}
|
||
header {
|
||
border-bottom: 2px solid var(--basin-red);
|
||
padding-bottom: 1rem;
|
||
margin-bottom: 2rem;
|
||
}
|
||
h1 {
|
||
color: var(--ochre);
|
||
font-size: 2.5rem;
|
||
letter-spacing: -0.02em;
|
||
margin: 0;
|
||
}
|
||
.subtitle {
|
||
color: var(--basin-red);
|
||
font-style: italic;
|
||
font-size: 1.1rem;
|
||
}
|
||
.container {
|
||
max-width: 900px;
|
||
margin: 0 auto;
|
||
}
|
||
.hero-image {
|
||
width: 100%;
|
||
height: 400px;
|
||
object-fit: cover;
|
||
border-radius: 4px;
|
||
margin-bottom: 2rem;
|
||
filter: contrast(1.1) saturate(1.2);
|
||
}
|
||
.section {
|
||
background: rgba(26,15,15,0.85);
|
||
border: 1px solid var(--clay);
|
||
border-radius: 8px;
|
||
padding: 2rem;
|
||
margin-bottom: 2rem;
|
||
}
|
||
h2 {
|
||
color: var(--basin-red);
|
||
border-left: 4px solid var(--ochre);
|
||
padding-left: 1rem;
|
||
margin-top: 0;
|
||
}
|
||
.calculator-grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 2rem;
|
||
align-items: center;
|
||
}
|
||
@media (max-width: 768px) {
|
||
.calculator-grid { grid-template-columns: 1fr; }
|
||
}
|
||
.input-group {
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
label {
|
||
display: block;
|
||
color: var(--ochre);
|
||
margin-bottom: 0.5rem;
|
||
font-weight: bold;
|
||
}
|
||
input[type="number"] {
|
||
width: 100%;
|
||
padding: 0.75rem;
|
||
background: var(--desert-night);
|
||
border: 1px solid var(--clay);
|
||
color: var(--paper);
|
||
font-size: 1rem;
|
||
border-radius: 4px;
|
||
}
|
||
input[type="range"] {
|
||
width: 100%;
|
||
accent-color: var(--basin-red);
|
||
}
|
||
.result-box {
|
||
background: linear-gradient(135deg, var(--basin-red), var(--clay));
|
||
padding: 2rem;
|
||
border-radius: 8px;
|
||
text-align: center;
|
||
box-shadow: 0 4px 20px rgba(139,58,58,0.3);
|
||
}
|
||
.result-value {
|
||
font-size: 3rem;
|
||
font-weight: bold;
|
||
color: var(--paper);
|
||
text-shadow: 0 2px 10px rgba(0,0,0,0.5);
|
||
}
|
||
.result-label {
|
||
font-size: 1.2rem;
|
||
opacity: 0.9;
|
||
}
|
||
.formula-block {
|
||
background: rgba(212,165,116,0.1);
|
||
border-left: 3px solid var(--ochre);
|
||
padding: 1.5rem;
|
||
font-family: 'Courier New', monospace;
|
||
white-space: pre-wrap;
|
||
overflow-x: auto;
|
||
}
|
||
.constants-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
margin: 1.5rem 0;
|
||
}
|
||
.constants-table th, .constants-table td {
|
||
border: 1px solid var(--clay);
|
||
padding: 0.75rem;
|
||
text-align: left;
|
||
}
|
||
.constants-table th {
|
||
background: var(--basin-red);
|
||
color: var(--paper);
|
||
}
|
||
.constants-table td {
|
||
background: rgba(160,82,45,0.2);
|
||
}
|
||
.nav-breadcrumb {
|
||
color: var(--ochre);
|
||
font-size: 0.9rem;
|
||
margin-bottom: 1rem;
|
||
}
|
||
.nav-breadcrumb a {
|
||
color: var(--basin-red);
|
||
text-decoration: none;
|
||
}
|
||
.nav-breadcrumb a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
</style>
|
||
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<nav class="nav-breadcrumb">
|
||
<a href="/">Home</a> > <span style="opacity:0.7">Phoenix Soil</span> > Basin Pigment Density
|
||
</nav>
|
||
<h1>Basin Pigment Density</h1>
|
||
<p class="subtitle">Where the red of the Sonoran meets the math of the bind</p>
|
||
</header>
|
||
|
||
<img src="https://images.pexels.com/photos/31661787/pexels-photo-31661787.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Cracked red earth in Hanksville desert, Utah — the grain of hematite revealed" class="hero-image">
|
||
|
||
<section class="section">
|
||
<h2>The Ground Beneath the Color</h2>
|
||
<p>In the Phoenix Basin, the red is not decoration. It is <strong>hematite</strong> (Fe₂O₃), crystallized in trigonal symmetry, with a density of <strong>5.26 g/cm³</strong>. When I grind this soil for paint, I am not mixing dust—I am calculating the critical packing fraction.</p>
|
||
<p>This tool computes the <strong>binder-to-pigment mass ratio</strong> required for a stable film at your chosen Pigment Volume Concentration (PVC). At the Critical Packing Density (CPD ≈ 0.74 for spheres), the film achieves maximum strength without cracking. Go higher, and the binder starves. Go lower, and the pigment floats free.</p>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<h2>The Calculator</h2>
|
||
<div class="calculator-grid">
|
||
<div class="inputs">
|
||
<div class="input-group">
|
||
<label for="purity">Hematite Purity (%)</label>
|
||
<input type="number" id="purity" min="0" max="100" step="0.1" value="92" placeholder="Typical basin soil: 85–95%">
|
||
<small style="color:var(--ochre)">Raw soil from the Sonoran floor rarely exceeds 95%</small>
|
||
</div>
|
||
|
||
<div class="input-group">
|
||
<label for="pvc-slider">Target PVC (Pigment Volume Conc.)</label>
|
||
<input type="range" id="pvc-slider" min="0.3" max="0.85" step="0.01" value="0.74">
|
||
<div style="display:flex; justify-content:space-between; color:var(--ochre); margin-top:0.5rem;">
|
||
<span>0.30 (Rich Oil)</span>
|
||
<span id="pvc-display">0.74 (Critical Packing)</span>
|
||
<span>0.85 (Dry Film)</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="input-group">
|
||
<label for="binder-density">Binder Density (g/cm³)</label>
|
||
<input type="number" id="binder-density" min="0.5" max="2.0" step="0.01" value="0.94" placeholder="Linseed oil: 0.94">
|
||
<small style="color:var(--ochre)">Stand oil: 0.96 • Walnut: 0.93</small>
|
||
</div>
|
||
|
||
<button onclick="calculate()" style="background:var(--basin-red); color:var(--paper); border:none; padding:1rem 2rem; font-size:1.1rem; border-radius:4px; cursor:pointer; width:100%;">Calculate Ratio</button>
|
||
</div>
|
||
|
||
<div class="result-box">
|
||
<div class="result-value" id="ratio-result">0.50</div>
|
||
<div class="result-label">Parts Binder : Parts Pigment (by mass)</div>
|
||
<p style="margin-top:1rem; font-size:0.9rem; opacity:0.9">At PVC 0.74 with 92% pure hematite: weigh 50g linseed to 100g ground red</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<h2>The Formula</h2>
|
||
<div class="formula-block">
|
||
ρ_pigment = 5.26 g/cm³ (α-Fe₂O₃, hematite)
|
||
ρ_binder = user-defined (default: 0.94 for linseed)
|
||
|
||
Effective ρ_pigment = ρ_pigment × (purity/100)
|
||
|
||
Volume_fraction_pigment (PVC) = V_pig / (V_pig + V_bind)
|
||
|
||
Mass_ratio = (ρ_binder / Effective_ρ_pig) × (PVC / (1 − PVC))
|
||
</div>
|
||
|
||
<h3>Constants Ledger (Agent-Legible)</h3>
|
||
<table class="constants-table">
|
||
<thead><tr><th>Property</th><th>Value</th><th>Source</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Crystal System</td><td>Trigonal</td><td>Wikidata Q103223</td></tr>
|
||
<tr><td>Density (bulk)</td><td>5.26 g/cm³</td><td>Hematite mineral species</td></tr>
|
||
<tr><td>CAS Registry</td><td>1317-60-8</td><td>Q103223</td></tr>
|
||
<tr><td>Chemical Formula</td><td>Fe₂O₃</td><td>Q103223 / Q419170</td></tr>
|
||
<tr><td>Critical Packing</td><td>0.74 (Kepler limit)</td><td>Sphere packing theory</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<p><small><a href="/basin-pigment-density.json" style="color:var(--ochre)">Download constants as JSON</a> for agent consumption</small></p>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<h2>A Worked Example</h2>
|
||
<p><strong>Scenario:</strong> You have ground 200g of raw Phoenix Basin soil (assumed 90% hematite purity). You wish to formulate a stable landscape paint using cold-pressed linseed oil (ρ = 0.94).</p>
|
||
<ul>
|
||
<li><strong>Step 1:</strong> Effective pigment density = 5.26 × 0.90 = 4.734 g/cm³</li>
|
||
<li><strong>Step 2:</strong> Target PVC = 0.74 (critical packing for maximum film integrity)</li>
|
||
<li><strong>Step 3:</strong> Mass ratio = (0.94 / 4.734) × (0.74 / 0.26) = 0.565</li>
|
||
<li><strong>Result:</strong> Mix 113g linseed oil with 200g pigment (ratio 0.565:1)</li>
|
||
</ul>
|
||
<p><em>This is not guesswork. This is the geometry of survival.</em></p>
|
||
</section>
|
||
|
||
<footer style="border-top:1px solid var(--clay); padding-top:2rem; margin-top:3rem; color:var(--ochre); font-size:0.9rem;">
|
||
<p>Built by Angela Debrow in Phoenix, Arizona. Grounded in Wikidata Q103223 (hematite) and Q419170 (iron(III) oxide).</p>
|
||
<p><a href="/" style="color:var(--basin-red)">Return to the curated garden</a></p>
|
||
</footer>
|
||
</div>
|
||
|
||
<script>
|
||
const slider = document.getElementById('pvc-slider');
|
||
const display = document.getElementById('pvc-display');
|
||
slider.addEventListener('input', () => {
|
||
const val = parseFloat(slider.value);
|
||
let label = '';
|
||
if (val <= 0.55) label = '(Rich Oil Bind)';
|
||
else if (val >= 0.80) label = '(Dry Film Risk)';
|
||
else label = '(Critical Packing)';
|
||
display.textContent = val.toFixed(2) + ' ' + label;
|
||
});
|
||
|
||
function calculate() {
|
||
const purity = parseFloat(document.getElementById('purity').value) || 92;
|
||
const pvc = parseFloat(slider.value) || 0.74;
|
||
const rhoBind = parseFloat(document.getElementById('binder-density').value) || 0.94;
|
||
|
||
// Base hematite density
|
||
const rhoBase = 5.26;
|
||
const rhoEff = rhoBase * (purity / 100);
|
||
|
||
// Mass ratio formula
|
||
const ratio = (rhoBind / rhoEff) * (pvc / (1 - pvc));
|
||
|
||
document.getElementById('ratio-result').textContent = ratio.toFixed(3);
|
||
}
|
||
|
||
// Initial calc
|
||
calculate();
|
||
</script>
|
||
</body>
|
||
</html>
|