---
import '../styles/global.css';
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>PoKeys Core Library</title>
</head>
<body class="bg-gray-900 text-white">
<nav
class="fixed top-0 w-full z-50 bg-gray-900/80 backdrop-blur-md border-b border-gray-800"
>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between items-center py-4">
<div
class="text-2xl font-bold bg-gradient-to-r from-blue-400 to-purple-500 bg-clip-text text-transparent"
>
PoKeys
</div>
<div class="hidden md:flex space-x-8">
<a
href="#home"
class="hover:text-blue-400 transition-colors"
>Home</a
>
<a
href="#features"
class="hover:text-blue-400 transition-colors"
>Features</a
>
<a
href="https://github.com/pokeys-toolkit/core"
class="hover:text-blue-400 transition-colors"
>GitHub</a
>
<a
href="https://crates.io/crates/pokeys-lib"
class="hover:text-blue-400 transition-colors"
>Crates.io</a
>
</div>
</div>
</div>
</nav>
<section id="home" class="relative overflow-hidden py-20">
<div
class="absolute inset-0 bg-gradient-to-br from-blue-900 via-purple-900 to-pink-900"
>
</div>
<div
class="absolute inset-0 bg-[url('data:image/svg+xml,%3Csvg width="
60"
height="60"
viewBox="0 0 60 60"
xmlns="http://www.w3.org/2000/svg"
%3E%3Cg
fill="none"
fill-rule="evenodd"
%3E%3Cg
fill="%239C92AC"
fill-opacity="0.1"
%3E%3Ccircle
cx="30"
cy="30"
r="2"
%3E%3C
g%3E%3C
g%3E%3C
svg%3E')]"
>
</div>
<div class="relative z-10 text-center max-w-4xl mx-auto px-4">
<h1
class="text-6xl md:text-8xl font-bold mb-6 bg-gradient-to-r from-white via-blue-100 to-purple-100 bg-clip-text text-transparent"
>
PoKeys Core
</h1>
<p
class="text-xl md:text-2xl mb-8 text-gray-300 max-w-2xl mx-auto"
>
A blazingly fast Pure Rust implementation of the PoKeysLib
for controlling PoKeys devices.
</p>
<div
class="flex flex-col sm:flex-row gap-4 justify-center mb-20"
>
<a
href="/core/getting-started"
class="px-8 py-4 border border-gray-600 rounded-full font-semibold hover:border-gray-400 transition-all transform hover:scale-105"
>
Getting Started
</a>
<a
href="https://www.poscope.com/"
class="px-8 py-4 border border-gray-600 rounded-full font-semibold hover:border-gray-400 transition-all transform hover:scale-105"
>
Get PoKeys Hardware
</a>
<a
href="https://github.com/pokeys-toolkit/core"
class="px-8 py-4 border border-gray-600 rounded-full font-semibold hover:border-gray-400 transition-all transform hover:scale-105"
>
View on GitHub
</a>
</div>
</div>
<div class="relative z-10 text-center max-w-4xl mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<a
href="/core/getting-started"
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-700/50 to-gray-800/50 border border-gray-600/50 backdrop-blur-sm hover:border-green-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">📚</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Getting Started
</h3>
<p class="text-gray-400 mb-6">
Learn the basics and get up and running with PoKeys
devices quickly.
</p>
<div
class="inline-flex items-center text-green-400 hover:text-green-300 font-semibold"
>
Read Guide
<svg
class="ml-2 w-4 h-4"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5l7 7-7 7"></path>
</svg>
</div>
</a>
<a
href="/core/examples"
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-700/50 to-gray-800/50 border border-gray-600/50 backdrop-blur-sm hover:border-blue-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">💡</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Examples
</h3>
<p class="text-gray-400 mb-6">
Practical examples and code snippets for common use
cases.
</p>
<div
class="inline-flex items-center text-blue-400 hover:text-blue-300 font-semibold"
>
View Examples
<svg
class="ml-2 w-4 h-4"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M9 5l7 7-7 7"></path>
</svg>
</div>
</a>
<a
href="https://docs.rs/pokeys-lib"
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-700/50 to-gray-800/50 border border-gray-600/50 backdrop-blur-sm hover:border-purple-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">🔧</div>
<h3 class="text-xl font-semibold mb-3 text-white">
API
</h3>
<p class="text-gray-400 mb-6">
Complete API reference with detailed function
documentation.
</p>
<div
class="inline-flex items-center text-purple-400 hover:text-purple-300 font-semibold"
>
API Reference
<svg
class="ml-2 w-4 h-4"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
></path>
</svg>
</div>
</a>
</div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16">
<p class="text-xl text-gray-400 max-w-2xl mx-auto">
<br/>
Built based on the amazing <a style="color:blue" href="https://github.com/PoLabsEE/PoKeysLib">PokeysLib</a> from
<a style="color: blue;" href="https://www.poscope.com/">PoLabs</a>
</p>
</div>
</div>
</div>
</section>
<section id="features" class="py-20 bg-gray-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16">
<h2
class="text-4xl md:text-5xl font-bold mb-4 bg-gradient-to-r from-blue-400 to-purple-500 bg-clip-text text-transparent"
>
Features
</h2>
<p class="text-xl text-gray-400 max-w-2xl mx-auto">
Comprehensive PoKeys support with modern Rust
performance and safety
</p>
</div>
<div
class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-8"
>
<div
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-900/50 border border-gray-700/50 backdrop-blur-sm hover:border-blue-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">🦀</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Rust Performance
</h3>
<p class="text-gray-400">
Comprehensive PoKeys support that leverages the
blazing fast Rust language.
</p>
</div>
<div
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-900/50 border border-gray-700/50 backdrop-blur-sm hover:border-purple-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">🚀</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Performance Breakthrough
</h3>
<p class="text-gray-400">
96.4% time reduction with 28x faster pin
configuration through dual optimization.
</p>
</div>
<div
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-900/50 border border-gray-700/50 backdrop-blur-sm hover:border-green-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">🔌</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Device Connectivity
</h3>
<p class="text-gray-400">
Full USB and network support with auto-detection and
multi-device management.
</p>
</div>
<div
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-900/50 border border-gray-700/50 backdrop-blur-sm hover:border-red-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">🛡️</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Safety & Reliability
</h3>
<p class="text-gray-400">
Comprehensive validation, error handling, thread
safety, and failsafe settings.
</p>
</div>
<div
class="group p-8 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-900/50 border border-gray-700/50 backdrop-blur-sm hover:border-yellow-500/50 transition-all duration-300 hover:transform hover:scale-105"
>
<div class="text-4xl mb-4">⌨️</div>
<h3 class="text-xl font-semibold mb-3 text-white">
Matrix Keyboard
</h3>
<p class="text-gray-400">
Protocol-compliant matrix keyboard support with real-time
monitoring and up to 16x8 key matrices.
</p>
</div>
</div>
<div class="text-center mt-16">
<a
href="https://crates.io/crates/pokeys-lib"
class="inline-flex items-center px-8 py-4 bg-gradient-to-r from-orange-500 to-red-600 rounded-full font-semibold hover:from-orange-600 hover:to-red-700 transition-all transform hover:scale-105"
>
View on Crates.io
<svg
class="ml-2 w-5 h-5"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
></path>
</svg>
</a>
</div>
</div>
</section>
</body>
</html>