2025-04-10 22:03:37 -05:00
<!doctype html>
< html lang = "en-US" >
<!-- TODO: We need more images and videos to improve quality of the site - if you can see this and have PhotonVision, take a screenshot of yourself using it and send it to the #media channel in Discord! -->
< head >
< title > PhotonVision< / title >
< link rel = "icon" href = "favicon.svg" type = "image/svg+xml" / >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< link rel = "stylesheet" href = "src/css/main.css" / >
< link rel = "stylesheet" href = "src/css/fontawesome.min.css" / >
< link rel = "stylesheet" href = "src/css/brands.min.css" / >
< link rel = "stylesheet" href = "src/css/solid.min.css" / >
< meta name = "title" content = "PhotonVision" / >
< meta
name="description"
content="PhotonVision is the free, fast, and easy-to-use computer vision solution for the FIRST Robotics Competition."
/>
<!-- Open Graph / Facebook -->
< meta property = "og:type" content = "website" / >
< meta property = "og:url" content = "https://photonvision.org/" / >
< meta property = "og:title" content = "PhotonVision" / >
< meta
property="og:description"
content="PhotonVision is the free, fast, and easy-to-use computer vision solution for the FIRST Robotics Competition."
/>
< meta
property="og:image"
content="https://photonvision.org/images/PhotonVision-Icon-BG_2.png"
/>
< / head >
< body class = "home bg-zinc-900 font-light text-white w-screen" >
< div id = "page-wrapper" class = "h-screen overflow-y-auto scroll-smooth" >
<!-- Header -->
< header
id="header"
class="bg-zinc-800 flex md:justify-end sticky top-0 w-full z-10"
>
< button
class="header-btn hover:bg-zinc-700 cursor-pointer flex md:!hidden"
popovertarget="mobile-nav"
aria-label="Open mobile navigation menu"
>
< i class = "fa-solid fa-bars !leading-[24px]" > < / i >
< / button >
< div class = "relative" >
< div
popover
id="mobile-nav"
class="h-screen starting:open:-translate-x-50 open:translate-0 transition-transform -translate-x-50 relative duration-400 transition-discrete bg-zinc-700 open:flex open:flex-col md:open:hidden"
>
< a
href="https://docs.photonvision.org/en/latest/"
class="header-btn"
>Documentation< /a
>
< a href = "https://discord.gg/wYxTwym" class = "header-btn" > Discord< / a >
< a
href="https://github.com/PhotonVision/photonvision/"
class="header-btn"
>GitHub< /a
>
2025-10-29 21:32:02 -05:00
< a
href="https://www.redbubble.com/people/PhotonVision/shop?asc=u"
class="header-btn"
>Merch< /a
>
2025-04-10 22:03:37 -05:00
< a
href="https://demo.photonvision.org"
class="header-btn bg-primary"
>Demo< /a
>
< / div >
< / div >
< nav id = "nav" class = "hidden md:flex" >
< a href = "https://docs.photonvision.org/en/latest/" class = "header-btn"
>Documentation< /a
>
< a href = "https://discord.gg/wYxTwym" class = "header-btn" > Discord< / a >
< a
href="https://github.com/PhotonVision/photonvision/"
class="header-btn"
>GitHub< /a
>
2025-10-30 16:49:01 -04:00
< a
href="https://www.redbubble.com/people/PhotonVision/shop?asc=u"
class="header-btn"
>Merch< /a
>
2025-04-10 22:03:37 -05:00
< a href = "https://demo.photonvision.org" class = "header-btn bg-primary"
>Demo< /a
>
< / nav >
< / header >
<!-- One -->
< section
class="flex flex-col h-[calc(100vh_-_56px)] justify-center items-center p-8 md:p-0 relative"
>
< div class = "flex justify-center md:justify-end flex-col md:flex-row" >
< header
class="flex flex-col gap-4 items-center md:items-end justify-center text-center md:text-end"
>
< h2 class = "text-4xl" > PhotonVision< / h2 >
< div class = "text-xl max-w-128" >
PhotonVision is the free, fast, and easy-to-use computer vision
solution for the FIRST® Robotics Competition. Teams can download
a PhotonVision image for select coprocessors and start tracking
targets in minutes.
< / div >
< a
href="https://docs.photonvision.org/en/latest/docs/quick-start/quick-install.html"
class="bg-primary py-4 px-8 rounded grow-0 self-center md:self-end"
>Get Started< /a
>
< / header >
< span class = "self-center md:self-initial mt-8 md:ms-8 shrink"
>< img
src="images/PhotonVision-Icon-BG.png"
alt="PhotonVision Logo"
class="max-w-64"
/>< / span >
< / div >
< a href = "#two" class = "absolute bottom-0 p-4" >
< i class = "fa-solid fa-chevron-down" > < / i >
< / a >
< / section >
<!-- Two -->
< section
id="two"
class="h-[calc(100vh_-_56px)] relative justify-center flex items-center"
>
< span class = "image fit"
>< img
src="images/demo.png"
alt="Demo of PhotonVision UI"
loading="lazy"
/>< / span >
< a href = "#three" class = "absolute bottom-0 p-4"
>< i class = "fa-solid fa-chevron-down" > < /i
>< / a >
< / section >
<!-- Three -->
< section
id="three"
class="min-h-[calc(100vh_-_56px)] flex flex-col gap-4 items-center justify-center px-4 md:px-14 lg:px-28 relative"
>
< header
class="flex flex-col gap-4 justify-center items-center text-center"
>
< h2 class = "text-3xl" > The Future is in Sight< / h2 >
< p class = "text-2xl" >
PhotonVision is a powerful, open-source vision system for FRC. It's
designed to be fast and easy to use, regardless of your team's
financial or technical resources.
< / p >
< hr class = "border-brand-yellow border-2 w-64 mb-4" / >
< / header >
< div class = "mb-8 lg:mb-0" >
< div
class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-10 lg:max-w-none lg:grid-cols-2 lg:gap-y-16"
>
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "fa-solid fa-location-arrow" > < / i >
< / div >
< h3 class = "text-lg mb-2" > First-Class AprilTag Support< / h3 >
< p > FRC Target tracking, out of the box.< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-chess-board" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Built-In Camera Calibration< / h3 >
< p >
Per-camera intrinsics calibration maximizes accuracy of
homography
< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-brain" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Machine Learning< / h3 >
< p > Hardware-accelerated inferencing for gamepiece detection< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-eye" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Driver Mode Integration< / h3 >
< p > You can use the same camera for driving and robot vision< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-camera" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Simultaneous Multi-Camera Operation< / h3 >
< p >
PhotonVision can run as many cameras as your hardware can handle
< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-layer-group" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Multi-Tag Pose Estimation< / h3 >
< p > Fuse all your available data for peak robot performance< / p >
< / section >
< / div >
< / div >
< a href = "#four" class = "absolute bottom-0 p-4"
>< i class = "fa-solid fa-chevron-down" > < /i
>< / a >
< / section >
<!-- Four -->
< section id = "four" >
< div class = "" >
< video
src="images/in-action.mp4"
playsinline
autoplay
loop
muted
loading="lazy"
class="w-full h-[calc(100vh_-_56px)] object-cover bottom-0 relative"
>< / video >
< / div >
< / section >
< section
id="five"
class="flex flex-col md:flex-row items-center justify-between relative mt-8 py-8 px-28 gap-8 bg-primary"
>
< header
class="flex flex-col gap-4 justify-center items-center text-center"
>
< h2 class = "text-3xl" > Champs 2024 Talk< / h2 >
< div class = "flex gap-2 mb-4" >
< a
href="https://docs.google.com/presentation/d/1Gh5InslM5p7aDxjzK8DHoEorpATOl-MQWWixY5GjGgs/edit#slide=id.p"
class="bg-brand-blue py-4 px-8 rounded grow-0 text-nowrap"
>Slide Deck< /a
>
< a
href="https://github.com/PhotonVision/champs_2024"
class="bg-brand-blue py-4 px-8 rounded grow-0 text-nowrap"
>Code< /a
>
< / div >
< / header >
< div class = "self-stretch contents" >
< iframe
src="https://www.youtube-nocookie.com/embed/iV2v7F_9GwE?si=4wgaT1IrZBpA71dF"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
class="max-w-256 aspect-video"
>< / iframe >
< / div >
< / section >
<!-- Eight -->
< section
id="six"
class="min-h-[calc(100vh_-_56px)] flex flex-col gap-4 items-center justify-center px-14 lg:px-28"
>
< header
class="flex flex-col gap-4 justify-center items-center text-center"
>
< h2 class = "text-3xl" > FOSS< / h2 >
< p class = "text-2xl" >
PhotonVision is an open-source, community based vision system
designed for use within the FIRST® Robotics Competition that aims
to provide easy and inexpensive vision tracking to teams.
< / p >
< hr class = "border-brand-yellow border-2 w-64 mb-4" / >
< / header >
< div >
< div
class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-10 lg:max-w-none lg:grid-cols-2 lg:gap-y-16"
>
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-check" > < / i >
< / div >
< h3 class = "text-lg mb-2" > Open Source< / h3 >
< p >
PhotonVision is the largest FOSS FRC Vision project to date,
constantly being updated with new features and bug fixes.
< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fa-solid fa-balance-scale" > < / i >
< / div >
< h3 class = "text-lg mb-2" > GNU GPL v3< / h3 >
< p >
The GNU GPL v3 license allows you to download, modify and share
source code.
< / p >
< / section >
< section class = "relative pl-16" >
< div class = "features-icon" >
< i class = "icon alt major fab fa-github" > < / i >
< / div >
< h3 class = "text-lg mb-2" > We're on GitHub< / h3 >
< p >
We do all of our development openly on GitHub. Transparency is
key for every contributor of PhotonVision.
< / p >
< / section >
< / div >
< / div >
< / section >
<!-- Footer -->
< footer
id="footer"
class="p-14 bg-zinc-700 flex flex-col items-center gap-8"
>
< img
src="images/PhotonVision-Icon-BG.png"
style="width: 50px; height: 50px"
alt="PhotonVision logo"
/>
< ul class = "text-sm" >
< li > © 2025 PhotonVision. All rights reserved.< / li >
< / ul >
< / footer >
< / div >
< script type = "module" src = "/src/main.ts" > < / script >
< / body >
< / html >
