{"blocks":[{"type":"paragraph","data":{"text":"Веб-разработчику может быть сложно идти в ногу с новейшими технологиями и трендами веб-дизайна."}},{"type":"paragraph","data":{"text":"Однако, поскольку CSS является фундаментальной частью интерфейсной веб-разработки, доступ к нужным инструментам CSS может существенно повлиять на производительность и креативность разработчика."}},{"type":"paragraph","data":{"text":"В этой статье мы рассмотрим некоторые из самых популярных инструментов CSS, которые помогут вам идти в ногу со временем и вывести свои навыки CSS на новый уровень."}},{"type":"header2","data":{"level":2,"text":"Неоморфизм"}},{"type":"paragraph","data":{"text":"Neumorphism.io — это веб-сайт, на котором можно сгенерировать блоки в стиле неоморфизма. Это мягкий пользовательский интерфейс, который также называют неоскевоморфизмом."}},{"type":"paragraph","data":{"text":"Сайт генерирует стили CSS с программным интерфейсом, используя тени."}},{"type":"image","data":{"file":{"id":241704,"url":"https://media.tproger.ru/uploads/2023/06/9c19bb35-f0b9-4ae7-95b3-e6a076e0b421.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/9c19bb35-f0b9-4ae7-95b3-e6a076e0b421.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 1","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/N1bJH2jjiFPvHHleC1vNRIl5xgRimEzqvEl_n5YcOhA/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/cmVHLj_YBaxefoC-XrfsFzOO5vwRVlC1veIDKwgCx7M/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/_4t9kLH5QZPuHWlOXTiAJtBn8G5YhHbHcJ7TVU2HwLE/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/5SddydBmRFHIydksUaVZXVxxwMX9p2zdm9Ytl6LCoWA/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/m75NKiMsRJTie1Kggt0sGsXha4bwpvZUb35ws83TFrI/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/gNjK6LZ4QVq8u3dAgd4qQzNKZ-jBs5ObAXO1qCjgfWY/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/udwRDu1t6ihXozSNl4rQwSWGSfKzkSPhTVxNhyXtAeU/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/B_yatWh8j46hTZ6a8XCG1kIktk4QOOwhI3c3r_7-NuY/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi85YzE5YmIzNS1mMGI5LTRhZTctOTViMy1lNmEwNzZlMGI0MjEucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Animista"}},{"type":"paragraph","data":{"text":"Animista — это коллекция анимаций CSS и пресетов, которые можно легко настроить и применить к веб-элементам."}},{"type":"image","data":{"file":{"id":241705,"url":"https://media.tproger.ru/uploads/2023/06/257a4bb6-2eca-4cb8-84ed-032f3d06a3ab.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/257a4bb6-2eca-4cb8-84ed-032f3d06a3ab.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 2","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/911GmsxLXpj9PXKZcDP4RQlGprX-dcJWFlLTnUPYfms/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/W4BQ8TJCsz2ocdb-YBmMUViTwbCUTsv2nFgEjl77wNw/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/nCELNQk1IH01uniJmzQ9FLqe4oo1Yfh9WDfjPOwIMJM/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/CMT0qto0-971bEBxkh1jvfFNBasC3wozJIaVJvbUV4s/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/rOXlquMpW1JVvUTD6da46vUOiTs2UNVraALMpsB2ATE/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/w512ijpJNRuMKZp2D3bCQ4hQFeMnJLukcPa439uwzpw/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/dbRj6GBKzDko3oUpm_aHmgCSOE5j_yZ3gOUueYX6G80/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/JyPfpX1JAYNRv-8oICtnGGKnkmkrqYUGwQducYk4CHM/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8yNTdhNGJiNi0yZWNhLTRjYjgtODRlZC0wMzJmM2QwNmEzYWIucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Анимированный фон"}},{"type":"paragraph","data":{"text":"Wweb.dev — генератор анимированных фонов CSS. Он позволяет создавать и настраивать анимированные фоны для своих веб-проектов."}},{"type":"image","data":{"file":{"id":241706,"url":"https://media.tproger.ru/uploads/2023/06/513cf5a7-1fbf-46b2-a03e-3d6673494782.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/513cf5a7-1fbf-46b2-a03e-3d6673494782.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 3","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/jTLn4TshrEb8XmFv7NrGIKbyq9pzSWO9OTlRpnAIxlA/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/e2_MsIhCt1pGoiU4rr0-mIaMOTaYJkLl0HHGTfIrVW0/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/zbNU85wJFPKFbCMvg-HoXqz_q4D1q_NUBnOPFU07r-c/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/Ax2Ka1Wo10dbc90LEtPgqx8_rWAtChfVjxmePqMp9cY/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/msC3p9dcZ8ARsZBUhGxIchyR8iLHUIwyRDSE_yK1Fbo/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/pdjLiby3bU2h0VvfPTYQojaGyUfbY0YRkfjSnNaAsls/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/imuVNN5nnL-HbUubwmc9FzhRrxcRXKUFLLXKpnWg6Q8/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/y8aoiLEqZoQgFxZASjzMltRAlxxWHUO3ObOh37hSWy0/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81MTNjZjVhNy0xZmJmLTQ2YjItYTAzZS0zZDY2NzM0OTQ3ODIucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Spin Kit"}},{"type":"paragraph","data":{"text":"Spin Kit — это коллекция анимаций загрузки на CSS, созданная Тобиасом Ахлином."}},{"type":"paragraph","data":{"text":"На сайте есть простые и настраиваемые анимации, которые можно легко интегрировать в веб-проекты."}},{"type":"image","data":{"file":{"id":241707,"url":"https://media.tproger.ru/uploads/2023/06/7db7c061-d221-4f9b-a626-6b86d47e2117.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/7db7c061-d221-4f9b-a626-6b86d47e2117.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 4","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/OS5QVWBwH1Ik7m_KasxB8QOZHslDwxPspSqjol-U4iI/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/mfVz0CKQ5zqDmIS9SzK323KG8ouLDeiCv148HQWaxx8/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/8o7TW3hhcqfbxR4ndfQIocl7mgzxs8TZXZ6RKJ7lIVM/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/f18LzYc1h15_KKm-8BatntIjcA5Ra9M5Hx9xHz_2mkU/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/8RMPDoLVYjP2gGPXIy5w1J9VQ1XU_AV0Uc2vVS_1k-I/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/1uRSoobxBdBbMEmizn4XX7Wqjiwv8P4LSq_-fmbqmFc/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/cSTq64eXc2lOVaFU0Poj8HeA03SSn4skbz2NNzO4b-U/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/U0DD-UrrzMg2rTxFlaalrETUgZl5HmUERbnNv3YkvI4/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZGI3YzA2MS1kMjIxLTRmOWItYTYyNi02Yjg2ZDQ3ZTIxMTcucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Flexplorer"}},{"type":"paragraph","data":{"text":"Flexplorer — это онлайн-инструмент веб-разработчика Беннета Фили, который помогает разработчикам изучать и экспериментировать с макетами CSS flexbox. Flexbox позволяет быстро создавать гибкие и адаптивные макеты."}},{"type":"image","data":{"file":{"id":241708,"url":"https://media.tproger.ru/uploads/2023/06/873d9b60-1d60-46eb-bb06-524c203d5c1c.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/873d9b60-1d60-46eb-bb06-524c203d5c1c.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 5","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/5Ilt8MjH8v8MiRzWZzA75rLAE9GSr0nwLU3Fl6XhL-E/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/ZsWk1wMhFNpD7KjP3TEPHNzGT5-nk6lYuNu8yrH_V3M/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/Dhavb7W-4hcQY0dC-6horGrZuXCfjPOnzEyvL23sN2Q/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/hBimDz_GMTnD6ujcLG_GE9SIVVTEfdnf1TY-gQeqGWA/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/sQvJs3rLW2gBU2iKXNQcH_RkOWm0c-ZxCiCaAT8MoJ8/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/CrANCVolrhwePUA_q37rAzQOKvY32GR_BzNAv7oOGEo/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/hQMz4NUOw0-uqR4K6V4h1YiEQRozjH5o4RIztCmaRqU/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/sIk53k8OGpPrYgbm2TKw0Wq2AMUGcoCxa4eXRehvPnE/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi84NzNkOWI2MC0xZDYwLTQ2ZWItYmIwNi01MjRjMjAzZDVjMWMucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Генератор сетки"}},{"type":"paragraph","data":{"text":"CSS Grid Generator — это веб-инструмент, который помогает разработчикам создавать сложные макеты сетки с помощью CSS Grid. Это мощный способ создания гибких и адаптивных дизайнов веб-страниц."}},{"type":"image","data":{"file":{"id":241709,"url":"https://media.tproger.ru/uploads/2023/06/af967ad6-8453-40a3-bab0-49bf2a18e268.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/af967ad6-8453-40a3-bab0-49bf2a18e268.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 6","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/PUxUN8akHmHfL7XdQP9JMc1JqQKkiAzH3c21h5PQPc8/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/4eKYLn707eP5aulATgIpH5xjJ3_M9djsMJC2nAVgQxM/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/isgNTdjG1R1NY3VokluwAWPm9cvy5jViCaqvP7C8XI4/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/lYYpswB3nHwL8Wk8kfCRX0PUtxCETukTvNurJh2fM2Y/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/Dl_O9xTlSdm4KW_Kp7reDM-YuJ9Mrlxh2Jur3H2cOQ8/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/JB0xL25CN8KMpyJWdAhViy3TgzJx3yXvsb1QchpUfAI/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/ghRwUfiupOAy9JKWn9VZ3NeHOavSn4PUXbtzT5djJUE/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/AoGbaOT9KMb1RHrM0Pjk9uepCSj1qKj4YsUSrTeggG8/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjk2N2FkNi04NDUzLTQwYTMtYmFiMC00OWJmMmExOGUyNjgucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Генератор макетов"}},{"type":"paragraph","data":{"text":"CSS Layout Generator — это веб-инструмент, который позволяет разработчикам создавать стили макетов CSS и экспериментировать с ними. Он предоставляет визуальный интерфейс для разработки и настройки компонентов макета."}},{"type":"image","data":{"file":{"id":241711,"url":"https://media.tproger.ru/uploads/2023/06/7ebd8c00-623c-4600-a9c6-c86baeb0c43a.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/7ebd8c00-623c-4600-a9c6-c86baeb0c43a.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 7","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/uJvQb4xDwu2hAF9zYUa1i2xt6xcFWAcwB4VQtqq-dvI/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/6mHKwYJz4Ttw0IgZb67fh3EcMCVNcq7gvgkgHs9uuJc/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/28hQf4q-m6iWhb0nJNLSuT98aCYgo9KjNrJyFpom4UI/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/xiXVzWGlW7KuhkXnnN8UpHmnI9KTD11kANZ5EvzTK84/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/TgryOnELbVWlnc1ZzU9sx_Z92eWan_-n-h5tRgJsWe8/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/eQ_QZ-k4XUeWvMkHhuDUH_yvhgPsMKCV9ltp7FzCf5I/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/HsaIwkmcjYceNQXA2Kv4YDrdGd0oD5jDt6fDujNOgXI/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/yr0A17pdI1KPc8CO0VaYWStWE54YoaZRkIkpYKFWOmQ/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi83ZWJkOGMwMC02MjNjLTQ2MDAtYTljNi1jODZiYWViMGM0M2EucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Shadows Brumm"}},{"type":"paragraph","data":{"text":"Shadows Brumm — это веб-инструмент для создания CSS-эффектов теней. У сайта простой интерфейс, который позволяет создавать сложные и красивые тени, используя множество параметров и опций."}},{"type":"image","data":{"file":{"id":241712,"url":"https://media.tproger.ru/uploads/2023/06/144893d9-ff10-4633-9f94-e3de7397fc09.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/144893d9-ff10-4633-9f94-e3de7397fc09.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 8","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/-3TLXCcoQdOj8VvPL4HqOkunY9oCKAUs4Fx99B2t0DQ/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/QQkklilALQHyz9Cnz5o169FO_dHjs_PauqPbpWcPyS0/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/bTRkA4KnNBEBqv9ut4AXPcucwhftY4uL1hDFbZ57vYk/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/9T34Y3RLJ1OeF2QIDupTcwqor9c2XIRIL7eMC_9gX_k/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/s65nIVi2NBHLMcFgmH3lR2rBLC1RQgq2wulJd8LyvNY/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/E3d9C-eoAERyQl6i6U2IJQ-oMzLICUV6XHBbhsCAjos/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/Z4dy6NfL1vR1SQBF-f5Oe69yD-QeEAg4SCE0ojiT18w/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/L_VKxQa2oybZyl6okR_XcPGXqBJaYWlEl1aBRXp13Tc/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi8xNDQ4OTNkOS1mZjEwLTQ2MzMtOWY5NC1lM2RlNzM5N2ZjMDkucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Глассморфизм"}},{"type":"paragraph","data":{"text":"Glassmorphism — это направление в дизайне, в котором используются прозрачные и размытые «стеклянные» фоны. "}},{"type":"image","data":{"file":{"id":241713,"url":"https://media.tproger.ru/uploads/2023/06/af9caa69-8d51-46ce-a4d9-a7ef1ef75d2f.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/af9caa69-8d51-46ce-a4d9-a7ef1ef75d2f.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 9","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/lARPwuMi0CjIG2slYGOdqEUO6RY1tmSLzF5fBO-f_Qg/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/7xqEmNIm49XRSYXdscS8L6bhpQ8aZ1KPCibpBjbhWis/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/nusE4W7DbH6HFuo2-Ua3h5zcaNrdO1qbt0FkbTymmHs/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/ahLLktrqdSnBSwijx5RJdNNQQC1X-khY4t4lSmIk5kM/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/KE9pq6WOZN24DQ7Mu9yMOoOArWgRR_ec2nesBTr5gPg/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/2XPbe_nERP3kPL_ac7L2cFB4-Bj5DNenLY0dqrsWbxQ/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/gNUxdwmu-7vDWmOJ-IYgO_vFGu6ch8fpw48tQtbl55U/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/ICHmRdsIl6bEypsI28TFldeA-IhxZq_DRkeU17E5R2Y/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi9hZjljYWE2OS04ZDUxLTQ2Y2UtYTRkOS1hN2VmMWVmNzVkMmYucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Cubic-Bezier"}},{"type":"paragraph","data":{"text":"Cubic-Bezier — это веб-инструмент, который позволяет пользователям создавать собственные кривые для плавных анимаций и переходов."}},{"type":"image","data":{"file":{"id":241714,"url":"https://media.tproger.ru/uploads/2023/06/5c076e9f-b8dd-491a-8c1f-e0480710aa8d.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1904,"height":921,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2023/06/5c076e9f-b8dd-491a-8c1f-e0480710aa8d.png","alt":"10 инструментов для CSS: анимация, сетки и дизайн 10","dimensions":{"width":1904,"height":921},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/EESP4nKGXK6ROmwWx0-vFBuuReaUsrGC8xnQvHyoCIg/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/K-AeiECIyOx4tkgnk-5TYdbwBWL30K59WbQrTZfNKx0/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/Tcizx5MPs6faIb9IkYnKZanDpbtwda01QQN4BhtMfuU/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/zcE8BYgCQ88S1NP2isVlsyfSjW7eilFfNiJpJ6cVFYk/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/GW2dKwzY-EgOwpPv04bCCPZSB-GgvuWGtwF7UKntYQg/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/I6LSufeYRQ_Yrzr6PPjqAdZe1Vk-oINW5pOCV9mDB-w/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/dxiL77Mss5fMWxqJnES7h_nTWXHyx08i3E94de-sY5Y/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/ZAxNi08DFKr1yWE1YtBfpu9ZHiiSyZGshj9JJvlx74Q/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAyMy8wNi81YzA3NmU5Zi1iOGRkLTQ5MWEtOGMxZi1lMDQ4MDcxMGFhOGQucG5n","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"header2","data":{"level":2,"text":"Заключение"}},{"type":"paragraph","data":{"text":"Инструменты CSS нужны разработчикам, которые хотят создавать визуально привлекательные и отзывчивые веб-сайты. Правильный набор инструментов сильно повышает производительность разработчиков и экономит время."}},{"type":"paragraph","data":{"text":"Не забывайте экспериментировать и находить решения, которые подходят для ваших проектов: правильные инструменты CSS помогут вам выйти на новый уровень."}}]}

Ошибка в настройках сайта