Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/muhammadpauzi/my-pins

List of My Pins
https://github.com/muhammadpauzi/my-pins

cheet-sheet code frameworks inspirations library list pins tips tricks website

Last synced: about 7 hours ago
JSON representation

List of My Pins

Awesome Lists containing this project

README 

        
# My Pins



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

- https://unblast.com/

- https://madewithlaravel.com

- https://cartzilla.createx.studio/docs/credits.html

- https://uigoodies.com/illustrations



# My Tech



### Whatsapp Gateway

- https://fonnte.com/

- https://onesender.net/



### Top Up

- https://id.digiflazz.com/

- https://bisnis.vocagame.com/

- https://vip-reseller.co.id/page/api/game-feature



### Payment Gateway

- https://midtrans.com

- https://tripay.co.id/

- https://flip.id/business

- https://tokopay.id/

- https://durianpay.id/

- https://www.xendit.co/



# Free Resources

- https://www.untitledui.com/logos

- https://logoipsum.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](https://app.hygraph.com/signup)

- [Navbar & Footer Inspiration](https://zaengle.com/blog/tailwind-typography-plugin)

- [Web Company Profile Inspiration](https://contentoo.com/)

- [Web Blog (components)](https://tsh.io/blog/headless-wordpress-as-an-api-for-a-next-js-application/)

- [Supabase Website Design](https://supabase.com/pricing)

- 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)

- https://www.qwick.com/



## 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



# AI Generated Free Images

- https://stockcake.com



# AI Generated Free Music

- https://stocktune.com



## 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/

    - https://www.highlights.design



## Icons

- https://www.streamlinehq.com/

- feathericons

- lucideicons

- fontawesome

- https://iconify.design/

- heroicons

- https://iconsax.io/

- https://unblast.com/icons/

- https://nucleoapp.com/free-icons

- https://simpleicons.org (Brand 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](https://javascript.plainenglish.io/writing-a-node-js-graphql-backend-that-actually-scales-a-complete-guide-part-1-setup-cddceae25bdc)

  - [Part 2](https://javascript.plainenglish.io/writing-a-node-js-graphql-backend-that-actually-scales-bd5b3411b293)

  - [Part 3](https://javascript.plainenglish.io/writing-a-node-js-graphql-backend-that-actually-scales-d20c920a4494)



# 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



# AlpineJS

- https://devdojo.com/pines/docs/introduction



# Headless CMS

- [Payload CMS](https://payloadcms.com/)

- [HyGraph CMS](https://hygraph.com/)

- 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

- https://fonts.google.com/specimen/Pathway+Extreme

- https://fonts.google.com/specimen/Instrument+Sans

- https://fonts.google.com/specimen/Unbounded



# Fonts for Brutalism Design

- Bricolage

- Lugati

- Unbounded

- Della gothic one

- Galgo

- https://fonts.google.com/specimen/Calistoga



# 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