Home
DESIGN.mdStar on GitHub
Inference is Fuel for AI

Groq delivers fast, low cost inference that doesn't flake when things get real.

Instant intelligence, deployed worldwide — GroqCloud runs open models on the LPU for speed at a winning cost.

GroqCloud Playground — Chat Completion
Playground
U
User
How fast is inference on Groq's LPU?
G
Assistant
Press Run to stream a completion…
0
tokens / second
Modelllama-3.3-70b-versatile
Time to first token—
Output tokens0
Total time—
POST /openai/v1/chat/completions api.groq.com idle 
# OpenAI compatible in just two lines.
from groq import Groq

client = Groq(api_key=os.environ.get("GROQ_API_KEY"))

completion = client.chat.completions.create(
    model="llama-3.3-70b-versatile",
    messages=[{"role": "user", "content": "Explain the LPU"}],
    stream=True,
)
Colors
Primary — Orange
orange#F43E01Brand accent, primary btn
orange-dark#C23101Hover / pressed
orange-middle#FE9E20Warm secondary
orange-light#FFD1A3Tint fills
Surfaces
utility-95#F3F3EELight page bg
utility-98#FAFAF8Lightest surface
utility-91#E8E8DERaised / section
utility-16#2A2A25Dark page bg
utility-20-blue#2D2F33Ink / dark section
Text
text (light)#2D2F33Primary on light
text (dark)#FFFFFFPrimary on dark
utility-61#9C9C90Muted / meta
Semantic — Fluorescent
fluorescent-green#10E68DSuccess / online
fluorescent-blue#5FC0FFInfo / links
fluorescent-yellow#FDEB20Attention
fluorescent-pink#F392DDHighlight
fluorescent-purple#D377FDCategory
Typography
display
Space Grotesk · 600 · −0.025em
Speed at a winning cost
44px600
heading
Space Grotesk · 600
Instant intelligence. Deployed worldwide.
28px600
subhead
Space Grotesk · 500
Benchmarks don't ship. Workloads do.
20px500
body
Space Grotesk · 400
Devs trust GroqCloud for inference that stays smart, fast and affordable.
15px400
eyebrow
Space Grotesk · 500 · .14em
Inference is Fuel for AI
12pxupper
mono
IBM Plex Mono · 400
model=llama-3.3-70b-versatile · 275 tokens/s
13pxmono
Components
Buttons
Input & badges
Online Beta LPU Preview
Model chips
llama-3.3-70b-versatile llama-3.1-8b-instant qwen3-32b gemma2-9b-it
Latency callout
276 tokens/s · llama-3.3-70b
Switch faster than you can read this.
Spacing
space-1
4
space-2
8
space-3
12
space-4
16
space-6
24
space-8
32
space-12
48
Guardrails
DO
Use one hot orange (#F43E01) as the single accent; let warm neutrals carry the layout
Keep backgrounds warm — #F3F3EE light, #2A2A25 dark — never pure #fff/#000
Make speed the hero: tokens/sec, time-to-first-token and total latency lead the story
Use IBM Plex Mono for model IDs, code, and all numeric/latency readouts
Reserve fluorescent colors for section theming, data, and status
DON'T
Confuse Groq with Grok/xAI — Groq is orange, LPU-based inference, no black "X"
Hardcode primary-button text color — it inverts to orange on hover
Stack multiple bright accents in one component — orange leads, fluorescents support
Use cool grey/blue neutrals for surfaces — the greyscale is yellow-warm
Invent latency numbers — pair speed claims with a concrete tokens/sec figure