@Neiz_Kap
Нач. программист, будущий фрилансер и бизнесмен :D

Как можно получить css-код или данные о тени блока из Adobe Photoshop?

Я верстаю макет из адоба фотошопа - учусь и практикуюсь, и в некоторых блоках попадаются различные тени. В первом блоке я тень сделал на глаз, что уже не точно. Так и я не особо разобрался в свойстве box-shadow, полез на форумы, и долго мучаясь сделал. Со вторым будет сложнее, так как там действительно труднее 5ec164a6e6a9f006842828.png да и не правильно надеяться на глазомер. Вот думаю, есть ли способы это сделать вернее и легче.
Я хабре нашёл похожий вопрос, но человек нашёл какое-то окошко, данные из которого можно преобразовать в css-код, а я даже не знаю как это окно вызвать. В адобе я тоже пока слаб и плох, с опытом придёт.
  • Вопрос задан
  • 95 просмотров
Решения вопроса 2
archelon
@archelon
есть avocode и zeplin.
а можно так:
psd-to-css-shadows.com
Ответ написан
SeaInside
@SeaInside
10 лет пилю все эти штуки
Правый клик по слою с тенью -> "Копировать CSS", в числе прочего там будет свойство "box-shadow".

Значения обычно выглядят не очень презентабельно, как-то так:
box-shadow: 7.5px 12.99px 95px 0px rgb( 0, 0, 0 );

Кроме того, фотошоп ничего не скажет, если используется режим наложения тени или непрозрачность.
На эти вещи придётся обратить внимание самостоятельно из этого окна (двойной клик на название эффекта под слоем):
5ec16d014a054365295081.png

После чего чуть-чуть почистим то, что у нас получается, и добавим прозрачность, если она отлична от 100%:
box-shadow: 8px 13px 95px 0px rgba(0, 0, 0, .5);

Выглядит заумно, но если знать, что делать и куда смотреть - секунд 10 уходит.
Или, как уже сказали, есть более специализированный софт, который с этим работает лучше.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы