Smarta verktyg och appar - speciellt de som sparar tid - är ett måste för designers. Och vi har samlat några av de senaste och bästa i den här listan med gratis verktyg för designers!
Från typografi som hjälper element att koda utdrag och färgpaletter du kan ladda ner, är den här listan fylld med vardagliga föremål för att göra ditt designliv enklare. Dyk in och hitta några gratis, praktiska verktyg för att förenkla ditt arbetsflöde.
1. Webgränser
Vem älskar inte en bra gradient? WebGradients är en samling med 180 linjära gradienter som du kan använda som innehållsbakgrund i någon del av din webbplats. Kopiera webbläsarkoden CSS3 eller ladda ner PNG, Sketch or Photoshop-versionerna.
2. Felfria Typografi Checklista
Listan av Typewolf är en uttömmande typografi master kurs som dubblerar som ett interaktivt verktyg för att hjälpa dig att undvika typkatastrofer. Listan är omfattande och ger enkel instruktion för att hjälpa dig att rätta till misstag.
3. LOL färger
Behöver du en inspirerande färgpalett? LOL är fylld med färg quads (och HEX-koder) för att hjälpa dig att hitta kombinationer som du kanske inte har övervägt.
4? resizr
Testa din hemsida med hjälp av det här verktyget som låter dig ange en webbadress och se den som användare gör på olika enheter. Du kan också växla mellan landskaps- och porträttvisningar.
5. CSS-statistik
Hur ser dina stilark ut? CSS-statistik är ett coolt verktyg som analyserar allt i ett användbart format. (Det är en bra hjälpare om du vill se vilken färg eller typsnitt som ingår i en design.)
6. Adobe Spark
Adobes Spark-verktyg är en gratis bildbyggare som är perfekt för att bygga reklamgrafik för sociala medier. Verktyget är snabbt och kan hålla dig från att spendera massiva mängder tid på dessa små bilder. (Och det fungerar som de flesta andra Adobe-produkter så det finns ingen riktig inlärningskurva.)
7. Google Web Designer
Den här appen är fortfarande i beta men hjälper dig att skapa engagemang, interaktiva HTML5-baserade mönster och rörelsesgrafik som kan köras på vilken enhet som helst. Vem skulle inte vilja ha hjälp från Google?
8. Font Library
Håll dig uppdaterad med alla Google Fonts med hjälp av det här verktyget som hjälper dig att märka och organisera allt du har i bruk.
9. Vilken typsnitt är
Är du inte säker på vad den fina nya typsnittet är att du fortsätter att se? Vilken typsnitt kan du ladda upp en bild eller ange en webbadress och få typmatchningar. Det ger också en bra lista med nära matcher för att hjälpa dig att hitta precis rätt typsnitt.
10. Död till lager
Detta är en lagerplats webbplats som inte har det traditionella utseendet på stock foton. Varje månad får abonnenterna ett gratis paket med foton att använda men de vill ha och varje kuratiseras av olika fotografer.
11. Todoist
Todoist är en praktisk liten checklista app. Använd den för att hålla reda på projekt i det snygga minimalistiska gränssnittet som är lätt att använda och störigt.
12. Bulma
Bulma är en enkel och modern CSS-ram byggd på Flexbox. Det är modulärt och lyhört och alla delar av koden är öppna på GitHub.
13. Musik för programmering
Förlåt den brutalistiska designen; Använd den stora funktionen Music for Programming. Webbplatsen är en sammansatt uppsättning musikblandningar gjorda för att lyssna på under programmeringen. (Eller du kan bara göra det till din spellista för nästan allt.)
14. PlaceIt
Om du behöver mockup för att visa upp projekt, har den här webbplatsen mer än 2500 kreativa commonsalternativ att välja mellan.
15. CSS linjal
Använd det här verktyget för att se skillnaderna mellan CSS-längder - teckensnitt, visningsandel och absolut. Ange dina värden och gå.
16. Patterninja
Den här lilla appen tar någon bild - du kan använda din eller använda det fria biblioteket - och omvandla det till ett mönster för användning i en mängd olika projekttyper. Det är ett verktyg du kan spela med hela dagen och inte bli uttråkad.
17. Tema.Kort
Hitta alla de bästa gratis teman för WordPress, Bootstrap och mer på ett ställe. Plus, varje tema och mall på webbplatsen är mottaglig så att du inte behöver vada genom mycket rodnad.
18. Skriv något
Tror du att du har en perfekt typografipalett tills du får den i CSS och inser att saker inte fungerar som planerat? Typ Något hjälper dig att skapa bra typsnittskombinationer som du kan se på skärmen, och justerar allt från teckensnitt till storlek till avstånd. Testa det innan du kodar det.
19. Img2CSS
Konvertera en bild till ren CSS. Ladda bara upp din bild och kolla på den magiska händelsen.
20. Glyphdiff
Jämför två tecken med detta verktyg. Välj två tecken från samma familj eller mycket olika kombinationer bara för skojs skull.
21. Impalette
Kontrollera om dominerar färger i bilder med ett Pantone-baserat nät. Det som gör verktyget ovanligt trevligt är att det ger massor av relaterade färgalternativ också.
22. Visual Center
Hitta objektets visuella centrum med hjälp av det här verktyget. (Du kan bli förvånad över var det faller i vissa bilder.) Du kan också få Sketch eller Illustrator plugins att använda verktyget offline.
23. Heltemönster
Den här databasen är fylld med repeterbara SVG-bakgrunder som du kan använda för webbprojekt. Justera förgrunden och bakgrundsfärgerna, opaciteten och hämtningen.
24. Platsrevisor
Var inte rädd om sökmotoroptimering. Site Auditor analyserar din webbplats för att hitta SEO-problem som kan hålla din webbplats från rankning på sökmotorer som Google. Det ger problem och lösningar som hjälper dig att optimera din webbplats bättre. (Gratis för en webbplats, upp till 50 sidor.)
25. Sketchpacks
Hitta och hantera plugins för Sketch app direkt från menyraden. Installationen med bara ett klick.
26. Etisk webbutveckling
Hjälp att skapa en bättre webb som en etisk designer. Denna lista innehåller många principer och riktlinjer för att hålla dig grundad.
27. Responsive Image Breakpoint Generator
Verktyget hjälper dig att välja de bästa bildupplösningarna för olika skärmstorlekar med hjälp av ett algoritmiskt koncept för att hitta bildbreddsvärden som ger en signifikant minskning av filstorleken.
28. Unsplash
Unsplash är en annan databas med högupplösta stock photography. Sök i databasen eller prenumerera och få bilder i din inkorg.
29. Material Design Palette
Allt material Design är trendigt idag, särskilt de ljusa färgerna. Det här verktyget hjälper dig att välja färger, se hur de kommer att se ut i designen och tillhandahålla en nedladdningsbar palett med suppleanter.
30. Typ Villkor
Om typografi lingo fortfarande låter främmande för dig från tid till annan, kommer det här animerade typografiska fuskarket att hjälpa dig att lära dig språket i bråttom.