My Pinneds

• https://govisually.com/blog/free-design-resources/
• https://unblast.com/

Free Certifications

• https://www.classcentral.com/report/free-developer-it-certifications/

Noise Sound (Free)

• https://noises.online/
• https://mynoise.net/
• https://asoftmurmur.com/
• https://www.moodil.com/

Wordpress Free Templates

• https://wpastra.com/
• https://creativethemes.com/blocksy/
• https://www.phlox.pro/
• https://rishitheme.com/
• https://woostify.com/
• https://themehunk.com/th-shop-mania/

🌟

• https://fffuel.co/

UI / UX / Designs / Templates / Icons / SVGs

Color Tools

• https://whocanuse.com
• https://color.review
• Color Constrast checker https://colourcontrast.cc
• Accessibleweb https://accessibleweb.com/color-contrast-cheker
• Venngage https://venngage.com/tools/accessible-color-pallete-generator
• https://huemint.com/brand-intersection/

Designer Tools, Helpers, Inspirations

• Mockup designs https://mockups-design.com
• https://pixcap.com
• https://shortcuts.design
• https://dirtylinestudio.com/freebies
• https://uiverse.io
• https://jitter.video
• https://sketchvalley.com
• https://www.fontpair.co/
• https://www.monotype.com/font-pairing#/
• https://shortcuts.design/
• https://typescale.com/
• https://untools.co/
• https://uxarchive.com/
• https://www.toools.design/
• https://www.brandguidelines.net/

Website Design Inspirations

• https://godly.website/
• https://www.lapa.ninja/
• https://www.saaspo.com/
• https://www.darkmodedesign.com/
• https://www.landingfolio.com/
• https://saaslandingpage.com/
• https://dribbble.com/
• https://www.behance.net/
• https://pinterest.com/
• https://uxarchive.com/
• https://ahrefs.com/blog/seo-meta-tags/ (Cocok untuk blog detail)
• Login Page & Components
• Navbar & Footer Inspiration
• Web Company Profile Inspiration
• Web Blog (components)
• Supabase Website Design
• https://www.scalahosting.com/blog/ scalaHosting Font & Blog Design
• https://www.scalahosting.com
• https://erik.cat/ (Personal Website)
• https://docs.flowfra.me/docs/laravel-trend (Example of simple concept of dashboard)

Dashboards (Free)

• https://preview.tabler.io/form-elements.html
• https://demo.plainadmin.com/signin.html
• https://windmill-dashboard.vercel.app/forms.html (Tailwind)
• https://demo.themesberg.com/volt/pages/dashboard/dashboard.html
• https://kamona-wd.github.io/starter-dashboard-layout/# (Tailwind)
• https://adminlte.io/themes/v3/pages/forms/general.html
• https://github.com/themeselection/sneat-bootstrap-html-admin-template-free
• https://github.com/zuramai/mazer
• https://github.com/stisla/stisla
• https://adminkit.io/
• https://coreui.io/
• https://www.bootstrapdash.com/bootstrap-free-admin-templates

CSS Blog Content Styles

• https://github.com/sindresorhus/github-markdown-css/blob/main/github-markdown-light.css

Background Generators

• https://www.csshero.org/mesher/ [Gradient CSS Generator]
• https://patternpad.com/
• https://app.haikei.app/ (🌟)
• https://bgjar.com/
• https://coolbackgrounds.io/
• https://meshgradient.in/
• https://codioful.com/
• https://www.svgbackgrounds.com/
• https://www.shadergradient.co

Loaders

• https://cssloaders.github.io/ (🌟)
• https://whirl.netlify.app/ (🌟)
• https://uiball.com/ldrs/ (🌟)
• https://loading.io/
• https://www.cssportal.com/css-loader-generator/
• https://codepen.io/vank0/pen/mrRwLg
• https://10015.io/tools/css-loader-generator

Ilustrations

• https://www.manypixels.co/gallery
• https://absurd.design/ (✨️)
• https://www.drawkit.com/#browse-now-button (✨️)
• https://iradesign.io/
• https://www.manypixels.co/gallery
• https://icons8.com/illustrations (✨️)
• https://popsy.co/illustrations
• https://www.lapa.ninja/blog/free-illustrations-library-for-your-project/
• https://superdevresources.com/3d-illustrations-free/
• https://www.uistore.design/categories/illustrations/
• https://www.streamlinehq.com/
• https://sapiens.ui8.net/6m5c3w7

SVGs

• https://svgbox.net/iconsets (loaders, highlight marker, icons, flags)
• https://www.svgrepo.com/
• Doodles / Abstract Shapes:
  • https://svgdoodles.com/
  • https://fffuel.co/dddoodle/

Icons

• https://www.streamlinehq.com/
• feathericons
• lucideicons
• fontawesome
• https://iconify.design/
• heroicons
• https://iconsax.io/
• https://unblast.com/icons/

Textures

• https://texturelabs.org/

Animations

• https://lottiefiles.com/animation/landing-page

UI Designs

• https://uidesigndaily.com/
• https://storyset.com/people
• https://codedesign.dev/ (Design with Resources File)
• https://freebiesupply.com/
• https://interfacer.xyz/
• https://uiverse.io/

Helpers

• https://devhints.io/ (code2 dasar)
• https://mem.dev/ (Untuk menyimpan snippet code)
• https://www.csshero.org (css editor/apalah)
• https://finddev.tools/ (Untuk menemukan tools)
• https://www.useblackbox.io/ (Seperti GitHub Copilot)
• https://devdocs.io/ (Satu untuk Semua Dokumentasi)
• https://www.happyhues.co/ (Pallete Warna Website)
• https://compressor.io/ (Compress Image)
• https://realtimecolors.com
• https://www.microcopy.me/ (Lorem Ipsum Alternative)

Mockup Generator

• https://rotato.app/
• https://www.animstats.com/
• https://mockrocket.io/
• https://shots.so/
• https://www.pacdora.com/

Design Web App

• https://www.kittl.com/
• https://www.figma.com/
• https://www.canva.com/
• https://www.photopea.com/

Microcontroller, Arduino, ESP Playground

• https://wokwi.com/
• https://www.tinkercad.com/

Web UI Library

• https://ui.aceternity.com/
• https://ui.shadcn.com/
• https://nextui.org/
• https://mui.com/
• https://headlessui.com/
• https://mantine.dev/
• https://www.radix-ui.com/
• https://chakra-ui.com/
• https://ant.design/
• https://react-bootstrap.netlify.app/
• https://primereact.org/
• https://react.semantic-ui.com/
• https://v2.grommet.io/
• https://onsen.io/v2/guide/react/
• https://tailwindui.com/
• https://blueprintjs.com/
• https://rsuitejs.com/
• https://marmelab.com/react-admin/
• https://chr15m.github.io/DoodleCSS/

Page Builder

• https://prismic.io

Freelancer Platforms

• https://www.peopleperhour.com/
• https://comeup.com/en/
• https://www.ifyoucouldjobs.com/
• https://workingnotworking.com/

AI

• https://huggingface.co/
• https://domoai.app/
• https://www.heygen.com/
• https://elevenlabs.io/app/speech-synthesis

Generators

• https://www.embedista.com/ (Embded Generator HTML for IG, Facebook, etc...)
• https://behold.so/

Lightbox Libraries

• https://fancyapps.com/
• https://fslightbox.com/

Caraousels

• https://ganlanyuan.github.io/tiny-slider/demo/
• Swiper
• Splide
• Owl JQuery

Learn

• https://learnxinyminutes.com/
• https://learnjavascript.online/
• GraphQL
  • Part 1
  • Part 2
  • Part 3

Cheet Sheets

• https://overapi.com/
• https://www.html-code-generator.com/
• https://www.html-code-generator.com/css/snippets/loading-animation (Loading CSS Animation)
• https://drawsql.app/templates/koel
• https://laravel-code.tips/

WYSIWYG

• https://tiptap.dev/
• https://ckeditor.com/
• https://quilljs.com/
• https://editorjs.io/ (Block)
• https://github.com/JefMari/awesome-wysiwyg-editors (More)

React

• React Hooks : React Use, React Haiku, Rooks
• Other : React Table, React Draggable, React Helmet
• Icons : React Icons, @heroicons/react
• State & Data Fetching : React Query, Axios, Redux Toolkit, Zustand
• Animations : Framer Motion, React Spring. GSAP
• TailwindCSS Stack : @headlessui/react, tailwindcss, @heroicons/react
• UI : Base Web, Chackra UI, Material UI

TailwindCSS & The Plugins

• Cocok untuk markdown style content : https://tailwindcss.com/docs/typography-plugin

Headless CMS

• Payload CMS
• HyGraph CMS
• Sanity
• Strapi

Fonts (Google Fonts)

• https://fontjoy.com/
• https://modernfontstacks.com/
• Segoe UI
• Source Sans Pro
• Public Sans
• Poppins
• Nunito / Sans
• Roboto
• Lato
• Merriweather
• Raleway
• QuickSans
• Outfit
• Supreme
• Hubot Sans
• Figtree
• Nacelle
• Be vietnam pro
• https://www.thedesignership.com/blog/best-free-fonts-for-ui-design
• Cabin
• Manrope
• Farro
• Signika
• IBM Plex Sans
• Noto Sans
• Titillium Web
• Sora Font
• https://fonts.google.com/specimen/Syne
• https://fonts.google.com/specimen/Alegreya?query=alegreya
• https://fonts.google.com/specimen/Eczar?query=eczar

Fonts for Brutalism Design

• Bricolage
• Lugati
• Unbounded
• Della gothic one
• Galgo

Analytics

• https://splitbee.io/

Productivity & Collaborative Tools

• Notion
• https://milanote.com/ (Lebih Flexsible)
• https://excalidraw.com/ (Drawing)
• https://plantuml.com/

Others

• https://nanoreview.net/ (Comparing CPU, Processor, Laptops and others)

Javascript Libs

Toasts, Notifactions, Alerts & Dialogs

• https://notifyjs.jpillora.com/
• https://alertifyjs.com/
• https://ireade.github.io/Toast.js/
• https://kamranahmed.info/toast
• https://ned.im/noty (BEST)
• https://izitoast.marcelodolza.com/ (BEST)
• https://bootboxjs.com/ (bootstrap modal)

Smooth Scrolling

• https://github.com/studio-freight/lenis (best)

Tooltips

• Tippyjs
• popover

Input File

• FilePond
• Dropzone
• upload-js
• @uppy
• mores : https://cssauthor.com/javascript-file-upload-library-plugins/

Sliders / Carousel

• https://splidejs.com/

Others

• https://github.com/elbywan/wretch

Figma Plugins

• Supa Pallete @angelolibero
• Autoflow @davidyitong
• Breakpoints @floweare
• Typescales @marvin
• Table Creator @gavinmcfarland
• Beautiful Shadows @aw