หน้าแรก>แหล่งข้อมูลการสร้างเว็บไซต์>ข้อมูลเว็บไซต์
ดาวน์โหลด

รายการเครื่องมือออนไลน์ฟรีสำหรับการพัฒนาเว็บส่วนหน้า (2020)

รายการเครื่องมือและแหล่งข้อมูลออนไลน์ฟรีในรูปแบบของเว็บแอปพลิเคชันหรือบริการเว็บสำหรับการพัฒนาส่วนหน้า เครื่องมือแต่ละตัวมีคำอธิบายสั้น ๆ และดูตัวอย่างเป็นภาพหน้าจอเว็บเพจ

  • การพิมพ์
    • คอลเลกชันแบบอักษร
  • สีจานและลวดลาย
    • เครื่องกำเนิดไฟฟ้า
    • บรรณาธิการรูปแบบ
    • เครื่องกำเนิดไฟฟ้าไล่ระดับสี
    • จานสี
    • ตัวจับสี
  • รูปภาพภาพประกอบวิดีโอ
    • ตัวแปลงภาพและบรรณาธิการ
  • CSS
    • เครื่องกำเนิดไฟฟ้าไล่ระดับสี CSS
    • CSS Animation Editors
    • เครื่องกำเนิดไฟฟ้า CSS สามเหลี่ยม
  • SVG
  • regex
  • คนอื่น

การพิมพ์

  • loremipsum.io - วิธีง่ายและดีกว่าในการคว้าเนื้อหาข้อความ Lorem Ipsum

  • gridlover.net/try - สร้างระบบตัวพิมพ์ด้วยสเกลแบบแยกส่วนและจังหวะแนวตั้ง

  • pearsonified.com/typography - เครื่องคำนวณการพิมพ์อัตราส่วนทองคำ

  • pxtoem.com - การแปลง PX เป็น EM

  • canva.com/font-combinations - การหาชุดค่าผสมแบบอักษร

  • fontpair.co - คอลเลกชันของการจับคู่ Google Fonts

  • transfonter.org - ตัวแปลงฟอนต์ออนไลน์

คอลเลกชันแบบอักษร

  • fontstruct.com/gallery - ชุดฟอนต์ (ต้องลงทะเบียน)

  • fonts.google.com - Google Fonts

  • FONTS2U.com - คอลเลกชันฟอนต์ฟรี

  • github.com/lvwzhen/iconpark - ชุดฟอนต์ไอคอน

สีจานและลวดลาย

  • Color-hex.com - ให้ข้อมูลเกี่ยวกับสี

  • colorhunt.co - คอลเลกชันของจานสี

  • Colourlovers.com - คอลเล็กชั่นจานสีลวดลายรูปร่างและสีสัน

  • Colrd.com - คอลเลกชันของจานสีลวดลายการไล่ระดับสีและสีสัน

  • heropatterns.com - คอลเลกชันของรูปแบบพื้นหลัง SVG ที่ทำซ้ำได้

  • toptal.com/designers/subtlepatterns - คอลเลกชันของรูปแบบ

  • patterncooler.com - คอลเลกชันของรูปแบบลวดลาย

เครื่องกำเนิดไฟฟ้า

  • color.hailpixel.com - เครื่องกำเนิดสีแบน

  • Colourco.de - เครื่องกำเนิดไฟฟ้า

  • paletton.com - นักออกแบบโทนสี

  • galactic.ink/sphere - ตัวสร้างสเปกตรัมสี

  • colorsupplyyy.com/app - สร้างส่วนผสมของสีต่างๆ

บรรณาธิการรูปแบบ

  • patterninja.com - ตัวแก้ไขรูปแบบ

  • halftonepro.com/app - ตัวแก้ไขรูปแบบ

  • qrohlf.com/trianglify-generator - ตัวสร้างรูปแบบสามเหลี่ยม

  • kennethcachia.com/plain-pattern - ตัวแก้ไขรูปแบบ SVG

เครื่องกำเนิดไฟฟ้าไล่ระดับสี

  • uigradients.com - คอลเลกชันของการไล่ระดับสี

  • colinkeany.com/blend - เครื่องกำเนิดความลาดชันพื้นหลัง

จานสี

  • flatuicolors.com - คอลเลกชันของจานสี

  • colordrop.io - คอลเลกชันของจานสี

  • color.adobe.com/explore - คอลเลกชันของจานสี

  • flatuicolorpicker.com/category/all - คอลเลกชันของสีแบน

ตัวจับสี

  • lokeshdhakar.com/projects/color-thief - คว้าจานสีจากภาพ

  • www.colorhunter.com - คว้าสีจากภาพ

  • Image-color.com - อีกสีหนึ่งจากภาพ

  • webColourData.com - คว้าสีจากเว็บไซต์

รูปภาพภาพประกอบวิดีโอ

  • pixabay.com - คอลเลกชันรูปภาพฟรี

  • Pexels.com - คอลเลกชันภาพฟรี

  • unsplash.com - คอลเลกชันรูปภาพฟรี

  • Free -Images.com - คอลเลกชันรูปภาพฟรี

  • Gratisography.com - คอลเลกชันของภาพฟรี

  • freephotos.cc - คอลเลกชันรูปภาพฟรี

  • kisspng.com - คอลเลกชันภาพ PNG โปร่งใส

  • vecteezy.com - คอลเล็กชั่นศิลปะเวกเตอร์ฟรี

  • undraW.co/illustrations - คอลเลกชันภาพประกอบฟรี

  • iconfinder.com - ตัวค้นหาไอคอน

  • Coverr.co - วิดีโอหน้าปกฟรี

  • mazwai.com - วิดีโอภาพยนตร์ฟรีภายใต้ CC โดยใบอนุญาต 3.0

ตัวแปลงภาพและบรรณาธิการ

  • jpeg.io - แปลงรูปแบบภาพที่สำคัญใด ๆ ให้เป็น JPEG ที่ได้รับการปรับปรุงอย่างสูง

  • tinypng.com - เครื่องมือการบีบอัดอื่นที่ช่วยให้การบีบอัดภาพ. png และ. jpg (อนุญาตให้รูปภาพได้สูงสุด 5MB)

  • เว็บไซต์ planet.com/webtools/imageCompressor - .png หรือ. jpg การบีบอัดเป็น. png ที่ปรับให้เหมาะสม (อนุญาตให้รูปภาพได้สูงสุด 50MB)

  • bse64.com - เข้ารหัสรูปภาพของคุณเป็น base64

  • lorempixel.com - ตัวสร้างภาพตัวยึด

  • xiconeditor.com - โปรแกรมแก้ไขไอคอนออนไลน์

  • favicon-enerator.org - Favicon Generator

  • toptal.com/developers/css/sprite-enerator - CSS Sprites Generator

  • Webebresizer.com/resizer - image editor

  • PICSVG.com - แปลง JPEG, JPG, GIF, PNG รูปภาพเป็น SVG

CSS

  • westciv.com/tools/3dtransforms - การไล่ระดับสี/บรรณาธิการแปลง

  • CSS3MAKER.com - CSS Editor และ Generators - Radius Border, Gradient, Transform, Animation, Transition, Text Shadow, Box Shadow, การหมุนข้อความ

  • CSSMATC.com - เครื่องกำเนิดไฟฟ้า CSS - การไล่ระดับสี, รูปแบบพื้นหลัง, เงากล่อง, รัศมีเส้นขอบ

  • cssmatic.com/box-shadow - CSS Drop Shadows Generator

  • Developer.mozilla.org/en-us/docs/web/css/css_background_and_borders/border-image_generator-ตัวสร้างภาพชายแดน CSS

  • cssfilters.co - ตัวแก้ไขตัวกรอง CSS

เครื่องกำเนิดไฟฟ้าไล่ระดับสี CSS

  • colorzilla.com/gradient-editor - CSS Gradient Generator

  • CSS -GRADIEN

  • GradientGenerator.com - CSS Gradient Generator พร้อมรูปแบบ

  • angertools.com/gradient - CSS Gradient Generator

CSS Animation Editors

  • TheAppGuruz.com/tag-tools/web/cssanimations - คอลเลกชันของแอนิเมชั่น CSS

  • anicollection.github.io - คอลเลกชันของแอนิเมชั่น CSS

  • CSSANIMATE.com - CSS Animation Generator

  • angertools.com/css/animation - CSS Animation Generator

  • Animista.net - CSS Animation Generator

  • Jeremyckahn.github.io/stylie - CSS Animation Generator

  • waitanimate.wstone.io - คำนวณเปอร์เซ็นต์ keyframe เพื่อให้คุณสามารถแทรกความล่าช้าระหว่างการวนซ้ำของแอนิเมชั่นแต่ละครั้ง

เครื่องกำเนิดไฟฟ้า CSS สามเหลี่ยม

  • cssarrowplease.com - สร้างกล่องที่กำหนดเองพร้อมลูกศรยื่นออกมาจากด้านข้าง

  • apps.eky.hk/css-triangle-enerator-CSS Triangle Generator

SVG

  • useragentman.com/tests/textpath/bezier-curve-construction-set-bézier curve generator

  • cssplant.com/clip-path-enerator-Clip Path Generator

  • bennettfeely.com/clippy - Clip Path Generator

  • jxnblk.com/paths - ตัวสร้างเส้นทาง

  • kazzkiq.github.io/svg-color-filter-ตัวแก้ไขตัวกรองสี SVG

  • yoksel.github.io/svg -filters - ตัวแก้ไขเอฟเฟกต์ตัวกรอง SVG

  • gigacore.github.io/demos/svg-stroke-dasharray-generator-เครื่องกำเนิดเส้นประ

  • editor.method.ac - SVG Editor

regex

  • regexr.com - การสร้างและทดสอบการแสดงออกปกติ

  • regex101.com - การสร้างและทดสอบการแสดงออกปกติ

คนอื่น

  • นักพัฒนา

  • Easings.net - คอลเลกชันของฟังก์ชั่นการผ่อนคลาย

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด