face-recognise

<!DOCTYPE html>

<head>

<title>Face Recognition kaise kaam karta hai | Dainik Focus</title>

<style>

:root{

color-scheme: light;

--bg:#F2F5F9; --surface:#FFFFFF; --tile:#E6ECF4; --ink:#12203A; --muted:#55627A; --line:#D9E0EA;

--accent:#0A7F72; --accent2:#D63A74; --on-accent:#FFFFFF;

--hero-bg:#0D1A36; --hero-ink:#EAF1FF; --hero-muted:#A9B9D6; --hero-accent:#3DD9C5;

}

@media (prefers-color-scheme: dark){

:root{

color-scheme: dark;

--bg:#0B1222; --surface:#131D33; --tile:#1B2742; --ink:#E8EEF9; --muted:#9AA8C2; --line:#26334F;

--accent:#3DD9C5; --accent2:#FF6B9A; --on-accent:#06201C;

--hero-bg:#070E1D;

}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.75 system-ui,-apple-system,"Segoe UI","Noto Sans",Roboto,sans-serif;-webkit-font-smoothing:antialiased}

a{color:var(--accent)}

:focus-visible{outline:3px solid var(--accent2);outline-offset:3px;border-radius:4px}

h1,h2,h3{line-height:1.15;letter-spacing:-.02em;margin:0}

.wrap{max-width:1040px;margin:0 auto;padding:0 22px}

.prose{max-width:680px}

/* Hero */

.hero{background:var(--hero-bg);color:var(--hero-ink);padding:56px 0 64px}

.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}

.hero h1{font-size:clamp(34px,5.4vw,60px);font-weight:800}

.hero p.dek{font-size:20px;color:var(--hero-muted);margin:20px 0 28px;max-width:34em}

.meta{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px;color:var(--hero-muted)}

.meta b{color:var(--hero-ink);font-weight:600}

.hero-art{width:100%;max-width:340px;justify-self:center;display:block}

.scan{animation:scan 2.6s ease-in-out .4s both}

.reveal{animation:reveal 2.6s ease-in-out .4s both}

@keyframes scan{0%{transform:translateY(0);opacity:1}90%{opacity:1}100%{transform:translateY(336px);opacity:0}}

@keyframes reveal{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}

@media (prefers-reduced-motion: reduce){.scan{display:none;animation:none}.reveal{animation:none}}

/* Article */

article{padding:56px 0 24px}

article h2{font-size:clamp(26px,3.6vw,36px);font-weight:750;margin:64px 0 18px}

article h2:first-child{margin-top:0}

article p{margin:0 0 20px}

article .lead{font-size:21px;line-height:1.65}

.figure{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:24px;margin:32px 0}

figcaption{font-size:15px;color:var(--muted);margin-top:14px;line-height:1.55}

/* Pipeline */

.flow{list-style:none;margin:32px 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}

.flow li{background:var(--surface);padding:18px 18px 22px}

.flow svg{width:100%;height:auto;display:block;border-radius:10px;margin-bottom:14px}

.flow h3{font-size:19px;font-weight:700;margin-bottom:6px}

.flow h3 span{color:var(--accent);margin-right:6px}

.flow p{font-size:15.5px;line-height:1.55;color:var(--muted);margin:0}

@media (max-width:900px){.flow{grid-template-columns:repeat(2,1fr)}}

/* Faceprint bars */

.bars .row{display:grid;grid-template-columns:170px 1fr;gap:14px;align-items:center;padding:8px 0}

.bars .row+.row{border-top:1px dashed var(--line)}

.bars .lbl{font-size:15px;font-weight:600;line-height:1.3}

.bars svg{width:100%;height:auto;display:block}

.axis{stroke:var(--line);stroke-width:1}

/* Match list */

.matches{list-style:none;margin:0;padding:0}

.matches li{display:grid;grid-template-columns:64px 1fr auto;gap:6px 16px;align-items:center;padding:12px 0}

.matches li+li{border-top:1px dashed var(--line)}

.matches .thumb{width:64px;height:64px;border-radius:10px;display:block}

.matches b{display:block;font-size:16px;line-height:1.3;margin-bottom:8px}

.meter{position:relative;height:10px;background:var(--tile);border-radius:6px}

.meter i{position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:6px;background:var(--accent)}

.no .meter i{background:var(--accent2)}

.meter::after{content:"";position:absolute;left:80%;top:-4px;bottom:-4px;width:2px;background:var(--ink);opacity:.55}

.res{text-align:right;font-weight:700;font-size:17px;line-height:1.2}

.res small{display:block;font-size:13px;font-weight:600;color:var(--accent)}

.no .res small{color:var(--accent2)}

.thr{font-size:14px;color:var(--muted);margin-top:10px}

/* Steps list */

.steps{list-style:none;counter-reset:s;margin:24px 0 28px;padding:0;max-width:680px}

.steps li{counter-increment:s;position:relative;padding:4px 0 18px 58px}

.steps li::before{content:counter(s);position:absolute;left:0;top:2px;width:38px;height:38px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font-weight:700}

.steps li:not(:last-child)::after{content:"";position:absolute;left:18px;top:44px;bottom:2px;width:2px;background:var(--line)}

.steps b{display:block;font-size:19px}

/* Tips */

.tips{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:24px 0}

.tips div{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;padding:14px 18px;font-size:16px;line-height:1.55}

.tips b{display:block;font-size:17px}

.tips .warn{border-left-color:var(--accent2)}

@media (max-width:720px){.tips{grid-template-columns:1fr}}

/* FAQ */

details{border-bottom:1px solid var(--line);max-width:680px}

summary{cursor:pointer;font-weight:650;font-size:18px;padding:16px 28px 16px 0;list-style:none;position:relative}

summary::-webkit-details-marker{display:none}

summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:26px;color:var(--accent);transition:transform .2s}

details[open] summary::after{transform:rotate(45deg)}

details p{margin:0 0 18px;color:var(--muted);font-size:17px}

/* CTA */

.cta{margin:72px 0 0;background:var(--hero-bg);color:var(--hero-ink);border-radius:22px;padding:40px 36px;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}

.cta h2{margin:0;font-size:clamp(24px,3.4vw,32px);color:var(--hero-ink)}

.cta p{margin:8px 0 0;color:var(--hero-muted);font-size:17px}

.btn{display:inline-block;background:var(--hero-accent);color:#06201C;font-weight:700;text-decoration:none;padding:14px 26px;border-radius:999px;font-size:17px}

.btn:hover{filter:brightness(1.08)}

footer{padding:40px 0 56px;color:var(--muted);font-size:15px}

@media (max-width:820px){

.hero{padding:40px 0 48px}

.hero .wrap{grid-template-columns:1fr}

.hero-art{max-width:260px}

.bars .row{grid-template-columns:1fr;gap:4px}

body{font-size:17px}

}

</style>

</head>

<body>

<defs>

</g>

</symbol>

</g>

</symbol>

</g>

</symbol>

</symbol>

</symbol>

</symbol>

</symbol>

</defs>

</svg>

<div>

<h1>Face Recognition kaise kaam karta hai: ek selfie se apni saari event photos</h1>

<p class="dek">Shaadi, school function ya press event, hazaaron photos mein apni tasveer dhundhna ab seconds ka kaam hai. Jaaniye ki iske peeche computer kya karta hai.</p>

<div class="meta"><span><b>Dainik Focus</b> Tech Desk</span><span>20 October 2026</span><span>5 minute ki padhai</span></div>

</div>

</g>

</g>

</svg>

</div>

</header>

<main>

<h2>Computer chehra "dekhta" nahi, naapta hai</h2>

<p class="lead">Hum kisi ko pehchaante hain to poora chehra ek jhalak mein yaad aa jaata hai. Computer ke liye chehra sirf pixels hain. Isliye wo chehre ko numbers mein badalta hai, aur numbers ko aapas mein milata hai.</p>

<p>Jab aap Dainik Focus par selfie upload karte hain, to peeche chaar kaam hote hain. Ye chaaron kaam kuch seconds mein ho jaate hain, chahe event mein hazaaron photos hon.</p>

</div>

<li>

</g>

</svg>

<h3><span>1.</span>Chehra dhundhna</h3>

<p>AI photo mein se har chehra alag pehchaan kar uske chaaron taraf box lagata hai.</p>

</li>

<li>

</svg>

<h3><span>2.</span>Landmarks</h3>

<p>Aankhein, naak, hont aur jabde jaise khaas points mark hote hain, aur unki doori naapi jaati hai.</p>

</li>

<li>

</g>

</svg>

<h3><span>3.</span>Digital faceprint</h3>

<p>Chehre ka structure numbers ki ek unique series ban jaata hai. Ye aapka digital fingerprint hai.</p>

</li>

<li>

<text x="120" y="116" text-anchor="middle" font-size="13" fill="var(--muted)" font-family="system-ui,sans-serif">milta-julta</text>

</svg>

<h3><span>4.</span>Matching</h3>

<p>Aapki selfie ke numbers event ki har photo ke numbers se milaye jaate hain.</p>

</li>

</ol>

<h2>Landmarks se faceprint tak</h2>

<p>Landmarks milne ke baad AI inki doori, kon aur anupaat (ratio) ko ek lambi numbers ki list mein badal deta hai. Is list ko <em>embedding</em> ya faceprint kehte hain. Aksar ek chehre ke liye 128 se 512 numbers hote hain.</p>

<p>Dilchasp baat ye hai ki aap ki do alag photos ke numbers lagbhag ek jaise aate hain, chahe roshni ya angle thoda alag ho. Kisi aur insaan ke numbers kaafi alag hote hain.</p>

</div>

<figcaption>Samjhane ke liye yahan sirf 24 numbers dikhaye gaye hain. Pehli do pattis (bars) lagbhag ek jaisi hain, teesri alag hai.</figcaption>

</figure>

<h2>Match kab maana jaata hai?</h2>

<p>Do faceprints ke beech ki doori naapi jaati hai. Doori jitni kam, chehre utne milte-julte. Ek tay seema (threshold) hoti hai: seema se upar wali photos aapko dikhai jaati hain, baaki chhod di jaati hain.</p>

</div>

<div><b>Stage par group photo</b><div class="meter"><i style="--w:97%"></i></div></div>

<div class="res">97%<small>Match</small></div>

</li>

<div><b>Chashma pehne hue (side se)</b><div class="meter"><i style="--w:91%"></i></div></div>

<div class="res">91%<small>Match</small></div>

</li>

<div><b>Kisi aur ki photo</b><div class="meter"><i style="--w:34%"></i></div></div>

<div class="res">34%<small>Match nahi</small></div>

</li>

<div><b>Doosre vyakti ki photo</b><div class="meter"><i style="--w:21%"></i></div></div>

<div class="res">21%<small>Match nahi</small></div>

</li>

</ul>

<p class="thr">Kaali khadi rekha tay seema (80%) dikhati hai. Ye sankhya sirf udaharan hai, asli system ki seema alag ho sakti hai.</p>

</figure>

<h2>Dainik Focus par selfie se photos kaise dhundhein</h2>

<li><b>Event ki gallery kholiye</b>Jis event mein aap gaye the, uski gallery par jaiye.</li>

<li><b>"Find My Photos" dabaiye</b>Ye button gallery ke upar milega.</li>

<li><b>Selfie lijiye ya upload kijiye</b>Camera se naya selfie lein ya gallery se ek saaf photo chunein.</li>

<li><b>Apni photos dekhiye</b>Aapki saari photos ek jagah dikhengi. Pasand wali download ya

Face Recognise