Less
Convierte fragmentos de Less en imágenes que merece la pena compartir, sin salir de tu Mac.
Los fragmentos de Less se enseñan normalmente para explicar un mixin o una guarda, dos cosas más fáciles de señalar en una imagen que de describir.
Codeshot detecta Less a partir del código que pegas, así que no hay selector de lenguaje que puedas equivocar. Aquí tienes el mismo fragmento en tres de los 30 temas incluidos, renderizados con las hojas de estilo de la propia app.
@ink: #0d0d10;
@radius: 14px;
.card(@shadow: 0 18px 40px rgba(23, 23, 32, 0.12)) {
border-radius: @radius;
box-shadow: @shadow;
color: @ink;
}
.snapshot { .card(); }@ink: #0d0d10;
@radius: 14px;
.card(@shadow: 0 18px 40px rgba(23, 23, 32, 0.12)) {
border-radius: @radius;
box-shadow: @shadow;
color: @ink;
}
.snapshot { .card(); }@ink: #0d0d10;
@radius: 14px;
.card(@shadow: 0 18px 40px rgba(23, 23, 32, 0.12)) {
border-radius: @radius;
box-shadow: @shadow;
color: @ink;
}
.snapshot { .card(); }Los valores de color y las variables son la parte interesante. Un tema neutro los mantiene legibles en vez de competir con ellos.
Deja que la imagen siga a tu contenido o fíjala a una proporción — 1:1, 4:3, 3:2, 16:9, 9:16, 2:3 o 3:4 — y exporta a 1×, 2× o 3× para que se mantenga nítida en pantallas retina. Cópiala al portapapeles con ⌘⇧C o guárdala con ⌘S.
Mira los 30 temas comparados o lee el flujo completo.
Todo se ejecuta en tu Mac. Tu código nunca sale de ahí.