Crosshair Generator
Build a precise crosshair with live preview, then copy settings, export CS2 console commands, download a PNG, or share the exact config via URL.
A good crosshair disappears against the fight: high contrast, tight but visible, and matched to your monitor and opponents' colors. This generator gives pixel-level control over color, thickness, length, gap, outline, center dot and error indicators, plus presets that mirror popular competitive setups.
"Test on page" pins the crosshair over your screen to try against real content.
Export
Settings summary
–
CS2 console commands (cl_crosshair*)
–
Full JSON config
–
How it works
Every control renders to a canvas preview immediately. The config object is serialized into the URL (?c=…) so sharing a link restores the exact crosshair. The CS2 export maps the visual settings onto the closest cl_crosshair_* console variables.
Example
The "Competitive" preset uses a thin 2px cyan cross with a 4px gap and subtle movement/firing error rings — the shape favored by most CS2 riflers. Switch to "Valorant" for the slightly larger green style with outline.
The math behind it
No heavy math — the preview is Canvas 2D drawing of lines and circles at the configured thickness/length/gap, scaled 3× for crispness.
Frequently Asked Questions
What color crosshair is best?
Contrast beats color. Green or cyan stand out against red/orange maps; neon pink works on blue-heavy scenes. Outline the crosshair in black to keep it visible on light walls.
Can I import this into Valorant?
Valorant has its own proprietary crosshair codes that this tool can't generate. Copy the settings summary and rebuild them in Valorant's settings screen — every parameter maps 1:1.
How do I use the CS2 commands?
Paste them into the developer console (~) or your autoexec.cfg. The generated values are close to cl_crosshair equivalents of the visual config.
Is the share link private?
Your settings live in the URL only. Nothing is uploaded anywhere — which is exactly how a client-only tool should work.