davidbisset.social

frontend

  • Why I 🧡 the web. WebTUI is a modular #CSS library that brings the beauty of Terminal UIs to the browser. đź’» https://webtui.ironclad.sh/ #frontend #webdev

  • Untitled post 60559

    Some nice #SVG tricks. Animated "Knight Rider" bars, table of contents tweaks, and more. https://fuma-nama.vercel.app/blog/svg-art #webdev #frontend #CSS

  • "Default styles for h1 elements are changing" #frontend #webdev #HTML https://developer.mozilla.org/en-US/blog/h1-element-styles/

  • A typeface for creating sparklines in text without code. https://github.com/aftertheflood/sparks?tab=readme-ov-file Works on both the desktop and the web where it works without #Javascript, though it does require a modern-ish web browser. #font #frontend #webdev

  • NebulaSans is a #font with two styles in six weights… good for "interfaces, print, and for any other graphical, digital, physical, metaphysical, metaphorical, or allegorical typeface needs". Available "for anyone to use under the SIL Open Font License." https://nebulasans.com/ #frontend

  • Wow if you are a #frontend or #CSS nerd, then come for the in-depth on anchor tags, stay maybe for the site design which is nice. https://thirty-five.com/overengineered-anchoring #webdev

  • Minimal #CSS only blurry image placeholders https://leanrada.com/notes/css-only-lqip/ #frontend #webdev

  • Debunking native in-browser spell-jacking. "For input fields that handle sensitive information, such as passwords, personal details, or proprietary data, ensure the spellcheck attribute is set to false." (TLDR: Being on the safe side) https://medium.com/doctolib/debunking-native-in-browser-spell-jacking-0fccdc06373b #frontend #webdev

  • How to do transparent inner border for images in #CSS https://css-tip.com/inner-border/ Cut a border from the inside of an image using the mask property and two gradients. #frontend

  • How to get those nice "super crispy" #SVG icons. https://persevering.substack.com/p/super-crispy-svg-icons #frontend #webdev

  • Styling Counters in #CSS https://css-tricks.com/styling-counters-in-css/ #frontend #webdev

  • Nice tool for #frontend developers and others. "Special #HTML Symbols" Copy a wide range of HTML symbols (arrows but lots of other ones, some of which I'm reminded exist. https://symbl.revend.group #webdev #webtools

  • Styling an #HTML dialog modal to take the full height of the viewport https://til.simonwillison.net/css/dialog-full-height #frontend

  • Trig-Animations.css "Predefined and configurable #CSS scroll animations that drop straight into your projects HTML." https://idev-games.github.io/Trig-JS/animations.html #frontend

  • On the #HTML front: "With the command and commandfor attributes, buttons can now perform actions on other elements declaratively." https://developer.chrome.com/blog/command-and-commandfor See: https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-command #webdev #frontend

  • Interesting: Image comparison slider in 6 lines of #JavaScript https://muffinman.io/blog/image-comparison-slider/ @codepen.io – https://codepen.io/stanko/pen/myddXKm #CSS #webdev #frontend

  • Agreed. "Knowing #CSS is mastery to Frontend Development." https://helloanselm.com/writings/knowing-css-is-mastery-to-frontend-development via https://mastodon.social/@helloanselm "You won’t be a master at frontend development if you don’t understand underlying mechanisms of a language." #webdev #frontend

  • Untitled post 60408

    “We saved money by giving a generic prompt and blindly trusting #AI to do the UI of our app.” 🤔 #memes #frontend

  • A Content List With Bulk Actions Using Ancient #HTML and Modern #CSS https://cloudfour.com/thinks/a-content-list-with-bulk-actions-using-ancient-html-and-modern-css/ #webdev #frontend

  • 100+ Open Source #SVG Spinners https://magecdn.com/tools/svg-loaders?ref=web-design-weekly.com #webdev #frontend #CSS

  • Building a QR Code #HTML Web Component via https://mstdn.social/@scottjehl https://scottjehl.com/posts/q-r #WebComponent #QR #frontend

  • "Build for the Web, Build on the Web, Build with the Web" From @csswizardry https://csswizardry.com/2025/01/build-for-the-web-build-on-the-web-build-with-the-web/ "Web as a platform = a safe bet…Opt into features incrementally…Embrace progressive enhancement…Write code that leans into browser, not away from it." #webdev #frontend #css

  • https://open-props-ui.netlify.app allows you to use components (like a menu, button, badge, or form elements) that you can copy and paste to your project. #opensource: https://github.com/felix-bohlin/ui #frontend #webdev #CSS

  • "Top 25 Website Fonts for 2025" https://bestwebdesigntools.com/blog/designers-favorite-top-25-website-fonts-for-2025 i'm not a big font person, but sometimes I do like to change things up. I'm a rebel. #free #frontend #webdev #fonts

  • Picyard is a tool for making your code snippets look nice with various themes and languages supported. I've seen apps (paid and free) do this, but if you need a free online solution work a look. https://www.picyard.in/code #frontend #CSS #webdev #JavaScript #PHP

  • If you wanted a little philosophy and self reflection with your #CSS then this might hit the spot. I’ve never personally identified with z-index until today. https://dev.to/eioluseyi/z-index-and-the-hierarchy-of-needs-1n #frontend #css #webdev

  • A “no-nonsense guide” to frontend for backend developers. https://hojimat.com/frontend-intro/. #webdev #frontend

  • rtx-on.js is an experimental #JavaScript library that enhances web pages by simulating in real time realistic lights and shadows using ray tracing. https://rtx-on.steren.fr/ #frontend

  • Usually not a fan of "top x" sites especially with light bait titles but… "Top 100 most creative and unique #portfolio websites of 2024" Bookmarking because there might be some inspiration gazing here. https://muz.li/blog/top-100-most-creative-and-unique-portfolio-websites-of-2024/ #frontend #design #webdev

  • Why I 🧡 the web. Someone built a site where you can scroll through all 16,777,216 hex colors in one grid. (If you ask "why" then i'm guessing you haven't had much experience with your own mad side projects). #frontend #webDev https://www.everyhex.codes/