CSS Shape
Повтори целевую фигуру настоящим CSS: размеры, углы, transform и flexbox.
Игры
CSS Shape
Меняй значения, пока твоя фигура не совпадёт с целью. 98% — уровень пройден.
Об игре
CSS Shape — головоломка, чтобы учить CSS на глаз. Слева — бледная целевая фигура, справа — твоя, нарисованная настоящими HTML-элементами с твоими значениями. Настраивай width, height, border-radius, transform, цвета, clip-path, flexbox и inset, пока они не совпадут.
30 уровней ручной работы — от простого квадрата до комбинаций. После каждого уровня показывается итоговый CSS с кнопкой Copy, чтобы использовать его в своём проекте.