Concevez CSS avec cet éditeur de Web-Style Adobe
Le logiciel d'Adobe est mondialement reconnu par les designers de tous âges, mais pas plus que Photoshop. Les panneaux d'édition de PhotoShop sont tout le shebang avec tout ce dont vous avez besoin pour construire des designs personnalisés.
Et maintenant, il y a un éditeur d'application web gratuit, appelé LayerStyles, qui imite l'éditeur de calques Photoshop directement dans votre navigateur. Il vous permet de générer dynamiquement du code CSS comme si vous travailliez dans Photoshop.
Si vous visitez la page du constructeur, vous pouvez le bricoler pour voir comment cela fonctionne.La fenêtre est fournie avec cinq panneaux de style différents qui imitent Photoshop. Ils suivent les mêmes paramètres et ils mettent à jour immédiatement avec une boîte de démonstration sur la page.
Voici les panneaux que vous pouvez choisir parmi:
- Ombre portée
- Ombre intérieure
- Contexte
- Frontière
- Rayon de la frontière
Ils imitent tous l'interface graphique d'Adobe qui rend cet outil si amusant pour les concepteurs. Vous obtenez également le code CSS complet, généré gratuitement.
Cliquez simplement sur la case en bas à gauche intitulée "Code CSS" pour obtenir votre extrait . Il est livré avec toutes les propriétés CSS3 pour tout ce que vous avez sélectionné.
Et le meilleur de tous, ce projet est complètement open source et gratuit sur GitHub si vous voulez télécharger une copie locale. Non seulement cela peut être amusant pour générer des CSS, mais c'est aussi un excellent moyen d'apprendre à construire une application web .
Le site utilise beaucoup de bibliothèques JavaScript, ainsi que des plugins jQuery . Il a été construit par le développeur Felix Niklas qui a fait cela comme un projet parallèle.
Vous pouvez trouver beaucoup de générateurs de code ailleurs, mais celui-ci est vraiment unique. C'est aussi l'application web la plus amusante et peut-être la plus cool que j'ai vue jusqu'ici cette année.
Jetez un oeil à LayerStyles et voyez ce que vous en pensez. Vous pouvez bricoler avec une version en direct sur la page de démonstration et de trouver tout le code source disponible gratuitement sur GitHub.Ou, si vous voulez diffuser grâce au créateur, vous pouvez tweeter vos admirations @mrflix.
Les sites Web prêts à l'emploi sont-ils en train de tuer le design Web?
Plus souvent qu'autrement, vous rencontrerez quelqu'un qui n'est pas aussi familier avec les allées et venues du design web et vous dire, " Je peux faire la même chose que vous, en utilisant Squarespace ".À quoi vous pourriez répondre avec dégoût ou colère .Je veux dire, ce n'est pas surprenant. L'
Guide complet de l'utilisation du format d'image WebP
WebP, ou officieusement prononcé comme weppy, est un format d'image introduit par Google Developers il y a environ 5 ans. Si vous êtes un concepteur Web, ou un développeur qui s'efforce de réduire et d'optimiser la taille de votre fichier image, ce que WebP est capable de faire devrait vous mettre un sourire aux lèvres.En b