{"id":59902,"date":"2026-04-17T19:14:00","date_gmt":"2026-04-17T16:14:00","guid":{"rendered":"https:\/\/csbepro.com\/?page_id=59902"},"modified":"2026-04-23T05:23:01","modified_gmt":"2026-04-23T02:23:01","slug":"cs2-crosshair-generator","status":"publish","type":"page","link":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/","title":{"rendered":"CS2 Crosshair Generator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"59902\" class=\"elementor elementor-59902\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-34ccc6f0 elementor-section-height-min-height elementor-section-items-stretch elementor-section-boxed elementor-section-height-default\" data-id=\"34ccc6f0\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4c993a73\" data-id=\"4c993a73\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fa7276f elementor-widget__width-auto elementor-hidden-mobile elementor-widget elementor-widget-breadcrumbs\" data-id=\"fa7276f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"breadcrumbs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p id=\"breadcrumbs\"><span><span><a href=\"https:\/\/csbepro.com\/ru\/%d0%b4%d0%be%d0%bc%d0%b0%d1%88%d0%bd%d1%8f%d1%8f\/\">Home<\/a><\/span><\/span><\/p>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-2ae24193 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"2ae24193\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-1c81b086\" data-id=\"1c81b086\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-55cc356 elementor-widget elementor-widget-html\" data-id=\"55cc356\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-hero\">\r\n\r\n    <div class=\"title-overlay\">\r\n        <h1 class=\"fade-in-up\">\r\n            CS2 Crosshair Generator\r\n        <\/h1>\r\n    \r\n        <p class=\"cs2-hero-subtext\">\r\n            Build, preview, copy, and compare custom CS2 crosshair commands with live settings and PRO presets\r\n        <\/p>\r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6c5134c6 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"6c5134c6\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-73b34e1b\" data-id=\"73b34e1b\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5912fe36 elementor-widget elementor-widget-html\" data-id=\"5912fe36\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-section\">\r\n\r\n    <p>\r\n        <a href=\"https:\/\/csbepro.com\/counter-strike-2\/\">Counter-Strike 2<\/a> gives you a lot of crosshair settings, but checking every variation through the console takes time. This CS2 Crosshair Generator lets you change size, gap, thickness, outline, color, and other values, preview the result right away, copy the exact CS2 crosshair commands, and test popular CS2 pro crosshair presets to compare different setups before using them in game.\r\n    <\/p>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-36418cc9 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"36418cc9\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-6a8592d1\" data-id=\"6a8592d1\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-7680f778 elementor-widget elementor-widget-html\" data-id=\"7680f778\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-section\">\r\n\r\n    <div class=\"cs2-preview-box\">\r\n\r\n        <div class=\"cs2-pro-presets\">\r\n          <div class=\"cs2-pro-presets-title\">PRO Crosshair Presets<\/div>\r\n        \r\n          <div class=\"cs2-pro-presets-grid\" id=\"proPresetsGrid\">\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"donk\">donk<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"m0nesy\">m0NESY<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"zywoo\">ZywOo<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"niko\">NiKo<\/button>\r\n        \r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"device\">device<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"ropz\">ropz<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"s1mple\">s1mple<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"broky\">broky<\/button>\r\n        \r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"xantares\">XANTARES<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"twistzz\">Twistzz<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"jimi\">Jimpphat<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"rain\">rain<\/button>\r\n        \r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"frozen\">frozen<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"b1t\">b1t<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"elige\">EliGE<\/button>\r\n            <button type=\"button\" class=\"cs2-pro-preset-btn\" data-preset=\"ax1le\">Ax1Le<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n\r\n        <div class=\"cs2-preview-stage bg-dark\" id=\"previewStage\">\r\n            <div class=\"cs2-preview-modes\">\r\n                <button type=\"button\" class=\"is-active\" data-bg=\"map\">Map<\/button>\r\n                <button type=\"button\" data-bg=\"dark\">Dark<\/button>\r\n                <button type=\"button\" data-bg=\"gray\">Gray<\/button>\r\n                <button type=\"button\" data-bg=\"white\">White<\/button>\r\n            <\/div>\r\n            \r\n            <button type=\"button\" class=\"cs2-preview-arrow left\" id=\"prevMap\">\u2039<\/button>\r\n    \r\n            <div class=\"cs2-crosshair\" id=\"crosshairPreview\">\r\n                <span class=\"line top\"><\/span>\r\n                <span class=\"line right\"><\/span>\r\n                <span class=\"line bottom\"><\/span>\r\n                <span class=\"line left\"><\/span>\r\n                <span class=\"dot\"><\/span>\r\n            <\/div>\r\n    \r\n            <button type=\"button\" class=\"cs2-preview-arrow right\" id=\"nextMap\">\u203a<\/button>\r\n        <\/div>\r\n    <\/div>\r\n\r\n\r\n  <div class=\"cs2-settings-panel\">\r\n    <div class=\"cs2-settings-grid cs2-settings-grid-3\">\r\n\r\n\r\n      <div class=\"cs2-settings-col\">\r\n\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"friendlyWarning\">Friendly Fire Reticle Warning<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"friendlyWarning\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"followRecoil\">Follow Recoil<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"followRecoil\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"centerDot\">Center Dot<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"centerDot\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"tStyle\">T Style<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"tStyle\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"weaponGap\">Deployed Weapon Gap<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"weaponGap\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-toggle\">\r\n          <label for=\"scopeDotColor\">Crosshair Color for Scope Dot<\/label>\r\n          <label class=\"cs2-switch\">\r\n            <input type=\"checkbox\" id=\"scopeDotColor\">\r\n            <span><\/span>\r\n          <\/label>\r\n        <\/div>\r\n      <\/div>\r\n\r\n\r\n      <div class=\"cs2-settings-col\">\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"lengthRange\">Length<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"lengthRange\" min=\"0\" max=\"10\" step=\"0.1\" value=\"5\">\r\n            <input type=\"number\" id=\"lengthValue\" min=\"0\" max=\"10\" step=\"0.1\" value=\"5\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"thicknessRange\">Thickness<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"thicknessRange\" min=\"0\" max=\"6\" step=\"0.1\" value=\"1\">\r\n            <input type=\"number\" id=\"thicknessValue\" min=\"0\" max=\"6\" step=\"0.1\" value=\"1\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"gapRange\">Gap<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"gapRange\" min=\"-5\" max=\"5\" step=\"0.1\" value=\"0\">\r\n            <input type=\"number\" id=\"gapValue\" min=\"-5\" max=\"5\" step=\"0.1\" value=\"0\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-advanced\">\r\n          <label for=\"outlineToggle\">Outline<\/label>\r\n          <div class=\"cs2-row-controls advanced\">\r\n            <label class=\"cs2-switch\">\r\n              <input type=\"checkbox\" id=\"outlineToggle\">\r\n              <span><\/span>\r\n            <\/label>\r\n            <input type=\"range\" id=\"outlineRange\" min=\"0.1\" max=\"3\" step=\"0.1\" value=\"1\" disabled>\r\n            <input type=\"number\" id=\"outlineValue\" min=\"0.1\" max=\"3\" step=\"0.1\" value=\"1\" disabled>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- COLUMN 3 -->\r\n      <div class=\"cs2-settings-col\">\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"redRange\">Red<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"redRange\" min=\"0\" max=\"255\" step=\"1\" value=\"50\">\r\n            <input type=\"number\" id=\"redValue\" min=\"0\" max=\"255\" step=\"1\" value=\"50\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"greenRange\">Green<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"greenRange\" min=\"0\" max=\"255\" step=\"1\" value=\"250\">\r\n            <input type=\"number\" id=\"greenValue\" min=\"0\" max=\"255\" step=\"1\" value=\"250\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-slider\">\r\n          <label for=\"blueRange\">Blue<\/label>\r\n          <div class=\"cs2-row-controls\">\r\n            <input type=\"range\" id=\"blueRange\" min=\"0\" max=\"255\" step=\"1\" value=\"50\">\r\n            <input type=\"number\" id=\"blueValue\" min=\"0\" max=\"255\" step=\"1\" value=\"50\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cs2-row cs2-row-advanced\">\r\n          <label for=\"alphaToggle\">Alpha<\/label>\r\n          <div class=\"cs2-row-controls advanced\">\r\n            <label class=\"cs2-switch\">\r\n              <input type=\"checkbox\" id=\"alphaToggle\" checked>\r\n              <span><\/span>\r\n            <\/label>\r\n            <input type=\"range\" id=\"alphaRange\" min=\"0\" max=\"255\" step=\"1\" value=\"200\">\r\n            <input type=\"number\" id=\"alphaValue\" min=\"0\" max=\"255\" step=\"1\" value=\"200\">\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n\r\n    <div class=\"cs2-bottom-grid\">\r\n      <div class=\"cs2-bottom-left\">\r\n          <div class=\"cs2-top-selects\">\r\n            <div class=\"cs2-row cs2-row-select\">\r\n              <label for=\"crosshairStyle\">Crosshair Style<\/label>\r\n              <select id=\"crosshairStyle\">\r\n                <option value=\"2\">Classic<\/option>\r\n                <option value=\"4\">Classic Static<\/option>\r\n                <option value=\"5\">Legacy<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"cs2-row cs2-row-select\">\r\n                <label for=\"crosshairColor\">Crosshair Color<\/label>\r\n                <select id=\"crosshairColor\">\r\n                  <option value=\"0\">Red<\/option>\r\n                  <option value=\"1\">Green<\/option>\r\n                  <option value=\"2\">Yellow<\/option>\r\n                  <option value=\"3\">Dark Blue<\/option>\r\n                  <option value=\"4\">Light Blue<\/option>\r\n                  <option value=\"5\">Custom Color (RGB)<\/option>\r\n                <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"cs2-row cs2-row-select\">\r\n              <label for=\"showObserverCrosshair\">Show Player Crosshairs<\/label>\r\n              <select id=\"showObserverCrosshair\">\r\n                <option value=\"0\">No<\/option>\r\n                <option value=\"1\">Friends and Party<\/option>\r\n                <option value=\"2\">Everyone<\/option>\r\n              <\/select>\r\n            <\/div>\r\n        \r\n            <div class=\"cs2-row cs2-row-select\">\r\n              <label for=\"observedBotCrosshair\">Show my crosshair when spectating bots<\/label>\r\n              <select id=\"observedBotCrosshair\">\r\n                <option value=\"0\">Always<\/option>\r\n                <option value=\"1\">When I can take over bot<\/option>\r\n                <option value=\"2\">Never<\/option>\r\n              <\/select>\r\n            <\/div>\r\n          <\/div>\r\n      <\/div>\r\n    \r\n    \r\n      <div class=\"cs2-bottom-right\">\r\n          <div class=\"cs2-output-box\">\r\n            <h3>Console Commands<\/h3>\r\n            <textarea id=\"consoleCommands\" readonly><\/textarea>\r\n        \r\n            <div class=\"cs2-output-actions\">\r\n              <button type=\"button\" id=\"resetCrosshair\">Default<\/button>\r\n              <button type=\"button\" id=\"copyCommands\">Copy<\/button>\r\n            <\/div>\r\n          <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n  const $ = (id) => document.getElementById(id);\r\n\r\n  const els = {\r\n    previewStage: $('previewStage'),\r\n    crosshair: $('crosshairPreview'),\r\n    consoleCommands: $('consoleCommands'),\r\n    resetBtn: $('resetCrosshair'),\r\n    copyBtn: $('copyCommands'),\r\n\r\n    modeButtons: document.querySelectorAll('.cs2-preview-modes button'),\r\n    prevMap: $('prevMap'),\r\n    nextMap: $('nextMap'),\r\n\r\n    showObserverCrosshair: $('showObserverCrosshair'),\r\n    observedBotCrosshair: $('observedBotCrosshair'),\r\n\r\n    crosshairStyle: $('crosshairStyle'),\r\n    crosshairColor: $('crosshairColor'),\r\n    friendlyWarning: $('friendlyWarning'),\r\n    followRecoil: $('followRecoil'),\r\n    centerDot: $('centerDot'),\r\n    tStyle: $('tStyle'),\r\n    weaponGap: $('weaponGap'),\r\n    scopeDotColor: $('scopeDotColor'),\r\n\r\n    lengthRange: $('lengthRange'),\r\n    lengthValue: $('lengthValue'),\r\n    thicknessRange: $('thicknessRange'),\r\n    thicknessValue: $('thicknessValue'),\r\n    gapRange: $('gapRange'),\r\n    gapValue: $('gapValue'),\r\n\r\n    outlineToggle: $('outlineToggle'),\r\n    outlineRange: $('outlineRange'),\r\n    outlineValue: $('outlineValue'),\r\n\r\n    redRange: $('redRange'),\r\n    redValue: $('redValue'),\r\n    greenRange: $('greenRange'),\r\n    greenValue: $('greenValue'),\r\n    blueRange: $('blueRange'),\r\n    blueValue: $('blueValue'),\r\n\r\n    alphaToggle: $('alphaToggle'),\r\n    alphaRange: $('alphaRange'),\r\n    alphaValue: $('alphaValue')\r\n  };\r\n\r\n\r\n  const mapImages = [\r\n    { name: 'pic1', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Overpass-Park-Entrance-in-CS2.jpg' },\r\n    { name: 'pic2', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Overpass-Bombsite-View-in-CS2.jpg' },\r\n    { name: 'pic3', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Anubis-B-Site-Approach-in-CS2.jpg' },\r\n    { name: 'pic4', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Anubis-Water-Corridor-in-CS2.jpg' },\r\n    { name: 'pic5', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Dust-2-Double-Doors-Area-in-CS2.jpg' },\r\n    { name: 'pic6', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Dust-2-Urban-Lane-in-CS2.jpg' },\r\n    { name: 'pic7', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Inferno-Apartment-Exit-in-CS2.jpg' },\r\n    { name: 'pic8', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Inferno-Side-Street-in-CS2.jpg' },\r\n    { name: 'pic9', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Mirage-A-Ramp-in-CS2.jpg' },\r\n    { name: 'pic10', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Mirage-A-Site-in-CS2.jpg' },\r\n    { name: 'pic11', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Nuke-Industrial-Entrance-in-CS2.jpg' },\r\n    { name: 'pic12', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Nuke-Interior-Hallway-in-CS2.jpg' },\r\n    { name: 'pic13', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Ancient-B-Entrance-in-CS2.jpg' },\r\n    { name: 'pic14', url: 'https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/Ancient-Interior-Lane-in-CS2.jpg' }\r\n  ];\r\n\r\n\r\n  const defaults = {\r\n    bgMode: 'map',\r\n    mapIndex: 0,\r\n\r\n    showObserverCrosshair: '0',\r\n    observedBotCrosshair: '0',\r\n\r\n    crosshairStyle: '2',\r\n    crosshairColor: '1',\r\n    friendlyWarning: false,\r\n    followRecoil: false,\r\n    centerDot: false,\r\n    tStyle: false,\r\n    weaponGap: false,\r\n    scopeDotColor: false,\r\n\r\n    length: 5,\r\n    thickness: 1,\r\n    gap: 0,\r\n\r\n    outlineEnabled: false,\r\n    outlineThickness: 1,\r\n\r\n    red: 50,\r\n    green: 250,\r\n    blue: 50,\r\n\r\n    alphaEnabled: true,\r\n    alpha: 200\r\n  };\r\n\r\n\r\n  const crosshairPresets = {\r\n    donk: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '4',\r\n      centerDot: 1,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 0,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    m0nesy: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '4',\r\n      centerDot: 1,\r\n      length: 0,\r\n      thickness: 2,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 0,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    zywoo: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1.5,\r\n      thickness: 0,\r\n      gap: -3,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0.0,\r\n      red: 255,\r\n      green: 255,\r\n      blue: 255,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    niko: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1.5,\r\n      gap: -5,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 145,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    device: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 1,\r\n      length: 0,\r\n      thickness: 0,\r\n      gap: -3,\r\n      outlineEnabled: 1,\r\n      outlineThickness: 1,\r\n      red: 250,\r\n      green: 255,\r\n      blue: 250,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    ropz: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '1',\r\n      centerDot: 0,\r\n      length: 2,\r\n      thickness: 0.5,\r\n      gap: -3,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 145,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    s1mple: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 255,\r\n      green: 255,\r\n      blue: 255,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    broky: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '4',\r\n      centerDot: 0,\r\n      length: 2,\r\n      thickness: 0,\r\n      gap: -3,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 170,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    xantares: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '1',\r\n      centerDot: 0,\r\n      length: 3,\r\n      thickness: 0.5,\r\n      gap: 0,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 50,\r\n      green: 250,\r\n      blue: 50,\r\n      alphaEnabled: 1,\r\n      alpha: 200,\r\n      tStyle: 0\r\n    },\r\n\r\n    twistzz: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1.5,\r\n      thickness: 0,\r\n      gap: -8,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 135,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    jimi: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '2',\r\n      centerDot: 0,\r\n      length: 2,\r\n      thickness: 0,\r\n      gap: -3,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 145,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    rain: {\r\n      crosshairStyle: '5',\r\n      crosshairColor: '4',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 0,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    frozen: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 168,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    b1t: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 0,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    elige: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 255,\r\n      green: 255,\r\n      blue: 255,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    },\r\n\r\n    ax1le: {\r\n      crosshairStyle: '4',\r\n      crosshairColor: '5',\r\n      centerDot: 0,\r\n      length: 1,\r\n      thickness: 1,\r\n      gap: -4,\r\n      outlineEnabled: 0,\r\n      outlineThickness: 0,\r\n      red: 0,\r\n      green: 255,\r\n      blue: 255,\r\n      alphaEnabled: 1,\r\n      alpha: 255,\r\n      tStyle: 0\r\n    }\r\n  };\r\n\r\n\r\n  const state = { ...defaults };\r\n\r\n  function clamp(value, min, max) {\r\n    return Math.min(Math.max(value, min), max);\r\n  }\r\n\r\n  function parseNum(value, min, max, fallback, step = 1) {\r\n    let n = parseFloat(value);\r\n    if (Number.isNaN(n)) n = fallback;\r\n    n = clamp(n, min, max);\r\n    const decimals = String(step).includes('.') ? String(step).split('.')[1].length : 0;\r\n    return Number(n.toFixed(decimals));\r\n  }\r\n\r\n  function syncPair(rangeEl, inputEl, min, max, fallback, step = 1, key) {\r\n    const value = parseNum(inputEl.value, min, max, fallback, step);\r\n    state[key] = value;\r\n    rangeEl.value = value;\r\n    inputEl.value = value;\r\n  }\r\n\r\n  function applyPreviewMode() {\r\n    els.previewStage.classList.remove('bg-map', 'bg-dark', 'bg-gray', 'bg-white');\r\n    els.previewStage.classList.add(`bg-${state.bgMode}`);\r\n\r\n    els.modeButtons.forEach((btn) => {\r\n      btn.classList.toggle('is-active', btn.dataset.bg === state.bgMode);\r\n    });\r\n\r\n    if (state.bgMode === 'map') {\r\n      els.previewStage.style.backgroundImage = `url(\"${mapImages[state.mapIndex].url}\")`;\r\n      if (els.prevMap) els.prevMap.style.display = 'flex';\r\n      if (els.nextMap) els.nextMap.style.display = 'flex';\r\n    } else {\r\n      els.previewStage.style.backgroundImage = 'none';\r\n      if (els.prevMap) els.prevMap.style.display = 'none';\r\n      if (els.nextMap) els.nextMap.style.display = 'none';\r\n    }\r\n  }\r\n\r\n  function applyPreviewCrosshair() {\r\n    const sizePx = Math.max(1, state.length * 1.99);\r\n    const thicknessPx = Math.max(0.5, state.thickness * 1.8);\r\n    const gapPx = 5.0 + (state.gap * 2.06);\r\n    const alpha = state.alphaEnabled ? state.alpha : 255;\r\n    const outlineOpacity = state.outlineEnabled ? 1 : 0;\r\n    const outlineSize = state.outlineEnabled ? Math.max(0.6, state.outlineThickness * 0.72) : 0;\r\n\r\n    let previewColor = {\r\n      r: state.red,\r\n      g: state.green,\r\n      b: state.blue\r\n    };\r\n\r\n    switch (state.crosshairColor) {\r\n      case '0':\r\n        previewColor = { r: 255, g: 0, b: 0 };\r\n        break;\r\n      case '1':\r\n        previewColor = { r: 0, g: 255, b: 0 };\r\n        break;\r\n      case '2':\r\n        previewColor = { r: 255, g: 255, b: 0 };\r\n        break;\r\n      case '3':\r\n        previewColor = { r: 0, g: 0, b: 255 };\r\n        break;\r\n      case '4':\r\n        previewColor = { r: 0, g: 255, b: 255 };\r\n        break;\r\n      case '5':\r\n      default:\r\n        previewColor = { r: state.red, g: state.green, b: state.blue };\r\n        break;\r\n    }\r\n\r\n    els.crosshair.style.setProperty('--ch-size', `${sizePx}px`);\r\n    els.crosshair.style.setProperty('--ch-thickness', `${thicknessPx}px`);\r\n    els.crosshair.style.setProperty('--ch-gap', `${gapPx}px`);\r\n    els.crosshair.style.setProperty('--ch-r', previewColor.r);\r\n    els.crosshair.style.setProperty('--ch-g', previewColor.g);\r\n    els.crosshair.style.setProperty('--ch-b', previewColor.b);\r\n    els.crosshair.style.setProperty('--ch-a', alpha);\r\n    els.crosshair.style.setProperty('--ch-outline-size', `${outlineSize}px`);\r\n    els.crosshair.style.setProperty('--ch-outline-opacity', outlineOpacity);\r\n\r\n    els.crosshair.classList.toggle('dot-enabled', state.centerDot);\r\n    els.crosshair.classList.toggle('t-style', state.tStyle);\r\n  }\r\n\r\n  function updateAdvancedControls() {\r\n    els.outlineRange.disabled = !state.outlineEnabled;\r\n    els.outlineValue.disabled = !state.outlineEnabled;\r\n\r\n    els.alphaRange.disabled = !state.alphaEnabled;\r\n    els.alphaValue.disabled = !state.alphaEnabled;\r\n  }\r\n\r\n  function updateColorControls() {\r\n    const isCustom = state.crosshairColor === '5';\r\n\r\n    els.redRange.disabled = !isCustom;\r\n    els.redValue.disabled = !isCustom;\r\n    els.greenRange.disabled = !isCustom;\r\n    els.greenValue.disabled = !isCustom;\r\n    els.blueRange.disabled = !isCustom;\r\n    els.blueValue.disabled = !isCustom;\r\n  }\r\n\r\n  function buildCommands() {\r\n    const lines = [\r\n      `cl_crosshairstyle \"${state.crosshairStyle}\"`,\r\n      `cl_crosshaircolor \"${state.crosshairColor}\"`,\r\n      `cl_crosshair_friendly_warning \"${state.friendlyWarning ? 1 : 0}\"`,\r\n      `cl_crosshair_recoil \"${state.followRecoil ? 1 : 0}\"`,\r\n      `cl_crosshairdot \"${state.centerDot ? 1 : 0}\"`,\r\n      `cl_crosshairsize \"${state.length}\"`,\r\n      `cl_crosshairthickness \"${state.thickness}\"`,\r\n      `cl_crosshairgap \"${state.gap}\"`,\r\n      `cl_crosshair_drawoutline \"${state.outlineEnabled ? 1 : 0}\"`,\r\n      `cl_crosshair_outlinethickness \"${state.outlineThickness}\"`,\r\n      `cl_crosshaircolor_r \"${state.red}\"`,\r\n      `cl_crosshaircolor_g \"${state.green}\"`,\r\n      `cl_crosshaircolor_b \"${state.blue}\"`,\r\n      `cl_crosshairusealpha \"${state.alphaEnabled ? 1 : 0}\"`,\r\n      `cl_crosshairalpha \"${state.alpha}\"`,\r\n      `cl_crosshair_t \"${state.tStyle ? 1 : 0}\"`,\r\n      `cl_crosshairgap_useweaponvalue \"${state.weaponGap ? 1 : 0}\"`,\r\n      `cl_ironsight_usecrosshaircolor \"${state.scopeDotColor ? 1 : 0}\"`,\r\n      `cl_show_observer_crosshair \"${state.showObserverCrosshair}\"`,\r\n      `cl_observed_bot_crosshair \"${state.observedBotCrosshair}\"`\r\n    ];\r\n\r\n    els.consoleCommands.value = lines.join('\\n');\r\n  }\r\n\r\n  function renderAll() {\r\n    applyPreviewMode();\r\n    applyPreviewCrosshair();\r\n    updateAdvancedControls();\r\n    updateColorControls();\r\n    buildCommands();\r\n  }\r\n\r\n  function syncUIFromState() {\r\n    els.showObserverCrosshair.value = state.showObserverCrosshair;\r\n    els.observedBotCrosshair.value = state.observedBotCrosshair;\r\n\r\n    els.crosshairStyle.value = state.crosshairStyle;\r\n    els.crosshairColor.value = state.crosshairColor;\r\n    els.friendlyWarning.checked = state.friendlyWarning;\r\n    els.followRecoil.checked = state.followRecoil;\r\n    els.centerDot.checked = state.centerDot;\r\n    els.tStyle.checked = state.tStyle;\r\n    els.weaponGap.checked = state.weaponGap;\r\n    els.scopeDotColor.checked = state.scopeDotColor;\r\n\r\n    els.lengthRange.value = state.length;\r\n    els.lengthValue.value = state.length;\r\n\r\n    els.thicknessRange.value = state.thickness;\r\n    els.thicknessValue.value = state.thickness;\r\n\r\n    els.gapRange.value = state.gap;\r\n    els.gapValue.value = state.gap;\r\n\r\n    els.outlineToggle.checked = state.outlineEnabled;\r\n    els.outlineRange.value = state.outlineThickness;\r\n    els.outlineValue.value = state.outlineThickness;\r\n\r\n    els.redRange.value = state.red;\r\n    els.redValue.value = state.red;\r\n    els.greenRange.value = state.green;\r\n    els.greenValue.value = state.green;\r\n    els.blueRange.value = state.blue;\r\n    els.blueValue.value = state.blue;\r\n\r\n    els.alphaToggle.checked = state.alphaEnabled;\r\n    els.alphaRange.value = state.alpha;\r\n    els.alphaValue.value = state.alpha;\r\n  }\r\n\r\n  function resetAll() {\r\n    Object.assign(state, defaults);\r\n    syncUIFromState();\r\n    renderAll();\r\n\r\n    document.querySelectorAll('.cs2-pro-preset-btn').forEach((btn) => {\r\n      btn.classList.remove('active');\r\n    });\r\n  }\r\n\r\n  els.modeButtons.forEach((btn) => {\r\n    btn.addEventListener('click', () => {\r\n      state.bgMode = btn.dataset.bg;\r\n      applyPreviewMode();\r\n    });\r\n  });\r\n\r\n  function applyCrosshairPreset(name) {\r\n    const preset = crosshairPresets[name];\r\n    if (!preset) return;\r\n\r\n    Object.assign(state, preset);\r\n    syncUIFromState();\r\n    renderAll();\r\n\r\n    document.querySelectorAll('.cs2-pro-preset-btn').forEach((btn) => {\r\n      btn.classList.toggle('active', btn.dataset.preset === name);\r\n    });\r\n  }\r\n\r\n  document.querySelectorAll('.cs2-pro-preset-btn').forEach((btn) => {\r\n    btn.addEventListener('click', () => {\r\n      applyCrosshairPreset(btn.dataset.preset);\r\n    });\r\n  });\r\n\r\n  if (els.prevMap) {\r\n    els.prevMap.addEventListener('click', () => {\r\n      if (state.bgMode !== 'map') return;\r\n      state.mapIndex = (state.mapIndex - 1 + mapImages.length) % mapImages.length;\r\n      applyPreviewMode();\r\n    });\r\n  }\r\n\r\n  if (els.nextMap) {\r\n    els.nextMap.addEventListener('click', () => {\r\n      if (state.bgMode !== 'map') return;\r\n      state.mapIndex = (state.mapIndex + 1) % mapImages.length;\r\n      applyPreviewMode();\r\n    });\r\n  }\r\n\r\n  els.showObserverCrosshair.addEventListener('change', () => {\r\n    state.showObserverCrosshair = els.showObserverCrosshair.value;\r\n    buildCommands();\r\n  });\r\n\r\n  els.observedBotCrosshair.addEventListener('change', () => {\r\n    state.observedBotCrosshair = els.observedBotCrosshair.value;\r\n    buildCommands();\r\n  });\r\n\r\n  els.crosshairStyle.addEventListener('change', () => {\r\n    state.crosshairStyle = els.crosshairStyle.value;\r\n    buildCommands();\r\n  });\r\n\r\n  els.crosshairColor.addEventListener('change', () => {\r\n    state.crosshairColor = els.crosshairColor.value;\r\n    renderAll();\r\n  });\r\n\r\n  [\r\n    ['friendlyWarning', 'friendlyWarning'],\r\n    ['followRecoil', 'followRecoil'],\r\n    ['centerDot', 'centerDot'],\r\n    ['tStyle', 'tStyle'],\r\n    ['weaponGap', 'weaponGap'],\r\n    ['scopeDotColor', 'scopeDotColor']\r\n  ].forEach(([id, key]) => {\r\n    els[id].addEventListener('change', () => {\r\n      state[key] = els[id].checked;\r\n      renderAll();\r\n    });\r\n  });\r\n\r\n  els.outlineToggle.addEventListener('change', () => {\r\n    state.outlineEnabled = els.outlineToggle.checked;\r\n    renderAll();\r\n  });\r\n\r\n  els.alphaToggle.addEventListener('change', () => {\r\n    state.alphaEnabled = els.alphaToggle.checked;\r\n    renderAll();\r\n  });\r\n\r\n  els.lengthRange.addEventListener('input', () => {\r\n    state.length = parseNum(els.lengthRange.value, 0, 10, defaults.length, 0.1);\r\n    els.lengthValue.value = state.length;\r\n    renderAll();\r\n  });\r\n\r\n  els.lengthValue.addEventListener('input', () => {\r\n    syncPair(els.lengthRange, els.lengthValue, 0, 10, defaults.length, 0.1, 'length');\r\n    renderAll();\r\n  });\r\n\r\n  els.thicknessRange.addEventListener('input', () => {\r\n    state.thickness = parseNum(els.thicknessRange.value, 0, 6, defaults.thickness, 0.1);\r\n    els.thicknessValue.value = state.thickness;\r\n    renderAll();\r\n  });\r\n\r\n  els.thicknessValue.addEventListener('input', () => {\r\n    syncPair(els.thicknessRange, els.thicknessValue, 0, 6, defaults.thickness, 0.1, 'thickness');\r\n    renderAll();\r\n  });\r\n\r\n  els.gapRange.addEventListener('input', () => {\r\n    state.gap = parseNum(els.gapRange.value, -5, 5, defaults.gap, 0.1);\r\n    els.gapValue.value = state.gap;\r\n    renderAll();\r\n  });\r\n\r\n  els.gapValue.addEventListener('input', () => {\r\n    syncPair(els.gapRange, els.gapValue, -5, 5, defaults.gap, 0.1, 'gap');\r\n    renderAll();\r\n  });\r\n\r\n  els.outlineRange.addEventListener('input', () => {\r\n    state.outlineThickness = parseNum(els.outlineRange.value, 0.1, 3, defaults.outlineThickness, 0.1);\r\n    els.outlineValue.value = state.outlineThickness;\r\n    renderAll();\r\n  });\r\n\r\n  els.outlineValue.addEventListener('input', () => {\r\n    syncPair(els.outlineRange, els.outlineValue, 0.1, 3, defaults.outlineThickness, 0.1, 'outlineThickness');\r\n    renderAll();\r\n  });\r\n\r\n  els.redRange.addEventListener('input', () => {\r\n    state.red = parseNum(els.redRange.value, 0, 255, defaults.red, 1);\r\n    els.redValue.value = state.red;\r\n    renderAll();\r\n  });\r\n\r\n  els.redValue.addEventListener('input', () => {\r\n    syncPair(els.redRange, els.redValue, 0, 255, defaults.red, 1, 'red');\r\n    renderAll();\r\n  });\r\n\r\n  els.greenRange.addEventListener('input', () => {\r\n    state.green = parseNum(els.greenRange.value, 0, 255, defaults.green, 1);\r\n    els.greenValue.value = state.green;\r\n    renderAll();\r\n  });\r\n\r\n  els.greenValue.addEventListener('input', () => {\r\n    syncPair(els.greenRange, els.greenValue, 0, 255, defaults.green, 1, 'green');\r\n    renderAll();\r\n  });\r\n\r\n  els.blueRange.addEventListener('input', () => {\r\n    state.blue = parseNum(els.blueRange.value, 0, 255, defaults.blue, 1);\r\n    els.blueValue.value = state.blue;\r\n    renderAll();\r\n  });\r\n\r\n  els.blueValue.addEventListener('input', () => {\r\n    syncPair(els.blueRange, els.blueValue, 0, 255, defaults.blue, 1, 'blue');\r\n    renderAll();\r\n  });\r\n\r\n  els.alphaRange.addEventListener('input', () => {\r\n    state.alpha = parseNum(els.alphaRange.value, 0, 255, defaults.alpha, 1);\r\n    els.alphaValue.value = state.alpha;\r\n    renderAll();\r\n  });\r\n\r\n  els.alphaValue.addEventListener('input', () => {\r\n    syncPair(els.alphaRange, els.alphaValue, 0, 255, defaults.alpha, 1, 'alpha');\r\n    renderAll();\r\n  });\r\n\r\n  els.resetBtn.addEventListener('click', resetAll);\r\n\r\n  els.copyBtn.addEventListener('click', async () => {\r\n    try {\r\n      await navigator.clipboard.writeText(els.consoleCommands.value);\r\n      const oldText = els.copyBtn.textContent;\r\n      els.copyBtn.textContent = 'Copied';\r\n      setTimeout(() => {\r\n        els.copyBtn.textContent = oldText;\r\n      }, 1200);\r\n    } catch (e) {\r\n      console.error(e);\r\n    }\r\n  });\r\n\r\n  syncUIFromState();\r\n  renderAll();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-42d4a8cd elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"42d4a8cd\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-13d9fe38\" data-id=\"13d9fe38\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5451538 elementor-widget elementor-widget-html\" data-id=\"5451538\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-section\">\r\n\r\n    <h2>How to Use the CS2 Crosshair Generator<\/h2>\r\n\r\n    <p>\r\n        This CS2 Crosshair Generator lets you build a crosshair visually instead of typing every command by hand in the console. You can adjust the core values, see the result in the preview, and immediately understand how each change affects the shape before copying the final commands into the game.\r\n    <\/p>\r\n\r\n    <p>\r\n        The generator is built around the settings that change the crosshair the most: length, thickness, gap, outline, and color. Length controls how long the lines are, thickness changes their weight, and gap sets the distance from the center. After that, outline and color help you tune visibility and make the crosshair easier to read\r\n    <\/p>\r\n\r\n    <p>\r\n        The PRO presets are there for quick comparison. You can load a pro player setup, check how it looks in the preview, and then keep it as it is or edit a few values to fit your own preference. This is also a convenient way to test several crosshair styles without searching for separate commands or codes.\r\n    <\/p>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-641c6ba5 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"641c6ba5\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-11d997d4\" data-id=\"11d997d4\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d23c615 elementor-widget elementor-widget-html\" data-id=\"d23c615\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-section\">\r\n\r\n    <h2>How to Apply CS2 Crosshair Commands In Game<\/h2>\r\n\r\n    <p>\r\n        After you finish the crosshair in the generator, click Copy to copy the full command list. Open CS2, enable the developer console if it is still disabled, open the console with the ~ key, paste the commands, and press Enter. The crosshair will update immediately.\r\n    <\/p>\r\n\r\n    <p>\r\n        If you want to keep the generated setup, save the commands in your <span class=\"term\">autoexec.cfg<\/span> file. That way your crosshair loads automatically every time you start the game.\r\n    <\/p>\r\n\r\n\r\n    <h3>Related CS2 Config Guides<\/h3>\r\n\r\n    <p>\r\n        This CS2 Crosshair Generator helps you build and copy crosshair commands quickly, but broader config work usually goes further than crosshair settings alone. If you want to save commands in autoexec.cfg, create separate config files, or organize a larger CS2 setup, the guides below are the next step.\r\n    <\/p>\r\n\r\n\r\n    <p>\r\n        A good place to start is <a href=\"https:\/\/csbepro.com\/cs2-article\/cs2-config-how-to-create-load-and-manage-cfg-files\/\">CS2 Config: How to Create, Load, and Manage CFG Files<\/a>, which explains how to create, load, and manage CS2 config files. For a wider list of useful commands, see <a href=\"https:\/\/csbepro.com\/cs2-article\/cs2-console-commands-guide-2026-best-practice-gameplay-fps-settings\/\">CS2 Console Commands 2026: Best Practice, Gameplay & FPS Settings<\/a>. If you need the exact folder path, <a href=\"https:\/\/csbepro.com\/cs2-article\/optimizing-counter-strike-2-player-configuration-files\/\">CS2 Config Location Guide 2026: Where are Config Files Stored?<\/a> explains where CS2 config files are located and where to place them.\r\n    <\/p>\r\n\r\n\r\n    <h3>Related CS2 Tools<\/h3>\r\n    \r\n    <p>You may also find these tools useful:<\/p>\r\n    <ul>\r\n        <li><a href=\"https:\/\/csbepro.com\/steamids-lookup\/\">SteamIDs Lookup & Converter<\/a><\/li>\r\n        <li><a href=\"https:\/\/csbepro.com\/cs2-steamid-extractor-get-player-ids-from-demo-files\/\">SteamIDs Lookup & Converter<\/a><\/li>\r\n        <li><a href=\"https:\/\/csbepro.com\/cs2-binds-generator\/\">CS2 Binds Generator<\/a><\/li>\r\n        <li><a href=\"https:\/\/csbepro.com\/cs2-config-generator\/\">CS2 Config Generator<\/a><\/li>\r\n    <\/ul>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-26b61ec8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"26b61ec8\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-5e54aee5\" data-id=\"5e54aee5\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-748232b0 elementor-widget elementor-widget-html\" data-id=\"748232b0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"cs2-section\">\r\n\r\n    <h2>CS2 Crosshair Generator FAQ<\/h2>\r\n\r\n    <img decoding=\"async\" src=\"https:\/\/csbepro.com\/wp-content\/uploads\/2024\/01\/Scripting-F.A.Q.jpg\"\r\n        alt=\"A glowing 'FAQ' displayed on a futuristic holographic panel, surrounded by floating question marks and digital circuitry within a cosmic, sci-fi environment\"\/>\r\n\r\n    <div class=\"cs2-faq\">\r\n\r\n        <details>\r\n          <summary>Does this CS2 Crosshair Generator use real in-game commands?<\/summary>\r\n          <p>Yes, the generator builds standard CS2 crosshair commands that can be pasted directly into the developer console and used in game.<\/p>\r\n        <\/details>\r\n    \r\n        <details>\r\n          <summary>Can I use PRO presets and still edit the crosshair?<\/summary>\r\n          <p>Yes, you can load any PRO preset, then change individual values such as gap, thickness, outline, or color. The generated commands update automatically after each change.<\/p>\r\n        <\/details>\r\n    \r\n        <details>\r\n          <summary>How do I apply the generated crosshair in CS2?<\/summary>\r\n          <p>Copy the generated commands, open the developer console in CS2, paste them, and press Enter. The crosshair updates immediately.<\/p>\r\n        <\/details>\r\n    \r\n        <details>\r\n          <summary>Can I save these crosshair commands for later?<\/summary>\r\n          <p>Yes, you can save the generated commands in your autoexec.cfg or another custom .cfg file if you want the same crosshair to load again later.<\/p>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>Why can the preview look slightly different from CS2?<\/summary>\r\n          <p>The preview is designed to stay close to the in-game look, but map background, brightness, resolution, scaling, and outline can still make small visual differences noticeable.<\/p>\r\n        <\/details>\r\n    \r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>CS2 Crosshair Generator Build, preview, copy, and compare custom CS2 crosshair commands with live settings and PRO presets Counter-Strike 2 gives you a lot of crosshair settings, but checking every variation through the console takes time. This CS2 Crosshair Generator lets you change size, gap, thickness, outline, color, and other values, preview the result right [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":59875,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-59902","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.8 (Yoast SEO v27.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>CS2 Crosshair Generator - Commands, Preview &amp; PRO Presets<\/title>\n<meta name=\"description\" content=\"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/\" \/>\n<meta property=\"og:locale\" content=\"ru_RU\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CS2 Crosshair Generator\" \/>\n<meta property=\"og:description\" content=\"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/\" \/>\n<meta property=\"og:site_name\" content=\"CSbePRO\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-23T02:23:01+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/CS2-Crosshair-Generator-Guide-Title-Image.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1075\" \/>\n\t<meta property=\"og:image:height\" content=\"715\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u041f\u0440\u0438\u043c\u0435\u0440\u043d\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 \u043c\u0438\u043d\u0443\u0442\u044b\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/\",\"url\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/\",\"name\":\"CS2 Crosshair Generator - Commands, Preview & PRO Presets\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/CS2-Crosshair-Generator-Guide-Title-Image.jpg\",\"datePublished\":\"2026-04-17T16:14:00+00:00\",\"dateModified\":\"2026-04-23T02:23:01+00:00\",\"description\":\"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/#breadcrumb\"},\"inLanguage\":\"ru-RU\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ru-RU\",\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/#primaryimage\",\"url\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/CS2-Crosshair-Generator-Guide-Title-Image.jpg\",\"contentUrl\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/CS2-Crosshair-Generator-Guide-Title-Image.jpg\",\"width\":1075,\"height\":715,\"caption\":\"A cover image combining a gaming setup with a live CS2 first-person view focused on crosshair placement.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/cs2-crosshair-generator\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/%d0%b4%d0%be%d0%bc%d0%b0%d1%88%d0%bd%d1%8f%d1%8f\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CS2 Crosshair Generator\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/#website\",\"url\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/\",\"name\":\"CSbePRO\",\"description\":\"A site where you can download any files for all versions of Counter-Strike\",\"publisher\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/#\\\/schema\\\/person\\\/c14cedfd1c120849b34529e7106dec66\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ru-RU\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/csbepro.com\\\/ru\\\/#\\\/schema\\\/person\\\/c14cedfd1c120849b34529e7106dec66\",\"name\":\"csbepro\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ru-RU\",\"@id\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/csbepro_logo.png\",\"url\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/csbepro_logo.png\",\"contentUrl\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/csbepro_logo.png\",\"width\":540,\"height\":467,\"caption\":\"csbepro\"},\"logo\":{\"@id\":\"https:\\\/\\\/csbepro.com\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/csbepro_logo.png\"},\"sameAs\":[\"https:\\\/\\\/csbepro.com\"]}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"CS2 Crosshair Generator - Commands, Preview & PRO Presets","description":"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/","og_locale":"ru_RU","og_type":"article","og_title":"CS2 Crosshair Generator","og_description":"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.","og_url":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/","og_site_name":"CSbePRO","article_modified_time":"2026-04-23T02:23:01+00:00","og_image":[{"width":1075,"height":715,"url":"https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/CS2-Crosshair-Generator-Guide-Title-Image.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"\u041f\u0440\u0438\u043c\u0435\u0440\u043d\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f":"4 \u043c\u0438\u043d\u0443\u0442\u044b"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/","url":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/","name":"CS2 Crosshair Generator - Commands, Preview & PRO Presets","isPartOf":{"@id":"https:\/\/csbepro.com\/ru\/#website"},"primaryImageOfPage":{"@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/#primaryimage"},"image":{"@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/#primaryimage"},"thumbnailUrl":"https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/CS2-Crosshair-Generator-Guide-Title-Image.jpg","datePublished":"2026-04-17T16:14:00+00:00","dateModified":"2026-04-23T02:23:01+00:00","description":"Use this CS2 Crosshair Generator to build, preview, and copy custom crosshair commands. Adjust size, gap, thickness, outline, color, and compare PRO presets.","breadcrumb":{"@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/#breadcrumb"},"inLanguage":"ru-RU","potentialAction":[{"@type":"ReadAction","target":["https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/"]}]},{"@type":"ImageObject","inLanguage":"ru-RU","@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/#primaryimage","url":"https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/CS2-Crosshair-Generator-Guide-Title-Image.jpg","contentUrl":"https:\/\/csbepro.com\/wp-content\/uploads\/2026\/04\/CS2-Crosshair-Generator-Guide-Title-Image.jpg","width":1075,"height":715,"caption":"A cover image combining a gaming setup with a live CS2 first-person view focused on crosshair placement."},{"@type":"BreadcrumbList","@id":"https:\/\/csbepro.com\/ru\/cs2-crosshair-generator\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/csbepro.com\/ru\/%d0%b4%d0%be%d0%bc%d0%b0%d1%88%d0%bd%d1%8f%d1%8f\/"},{"@type":"ListItem","position":2,"name":"CS2 Crosshair Generator"}]},{"@type":"WebSite","@id":"https:\/\/csbepro.com\/ru\/#website","url":"https:\/\/csbepro.com\/ru\/","name":"CSbePRO","description":"A site where you can download any files for all versions of Counter-Strike","publisher":{"@id":"https:\/\/csbepro.com\/ru\/#\/schema\/person\/c14cedfd1c120849b34529e7106dec66"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/csbepro.com\/ru\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ru-RU"},{"@type":["Person","Organization"],"@id":"https:\/\/csbepro.com\/ru\/#\/schema\/person\/c14cedfd1c120849b34529e7106dec66","name":"csbepro","image":{"@type":"ImageObject","inLanguage":"ru-RU","@id":"https:\/\/csbepro.com\/wp-content\/uploads\/2024\/11\/csbepro_logo.png","url":"https:\/\/csbepro.com\/wp-content\/uploads\/2024\/11\/csbepro_logo.png","contentUrl":"https:\/\/csbepro.com\/wp-content\/uploads\/2024\/11\/csbepro_logo.png","width":540,"height":467,"caption":"csbepro"},"logo":{"@id":"https:\/\/csbepro.com\/wp-content\/uploads\/2024\/11\/csbepro_logo.png"},"sameAs":["https:\/\/csbepro.com"]}]}},"_links":{"self":[{"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/pages\/59902","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/comments?post=59902"}],"version-history":[{"count":0,"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/pages\/59902\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/media\/59875"}],"wp:attachment":[{"href":"https:\/\/csbepro.com\/ru\/wp-json\/wp\/v2\/media?parent=59902"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}