jQuery Script Blog

Weekly Web Design & Development News: Collective #494

by jQueryScript,

A collection of the latest and hottest design and development resources (Javascript libraries, CSS snippets, DeveloGraphic Design Resources, etc.) on the web from the last week (Week 12, 2023).

Web Design & Development News: Collective #494

Trig-JS

The easy way to create CSS scroll animations that react to the position of your HTML element on screen. Animate on scroll (AOS) your CSS.

Chatbot UI

[Demo] [Download]

Chat UI Builder

A CSS framework that aims to provide user interaction with very little or no Javascript at all.

Chat UI Builder

[Demo] [Download]

Ellegant CSS Micro Framework

A CSS library for creating interactive, responsive HTML presentations, one-page scrolling websites, and vertical page sliders without JavaScript.

Ellegant CSS Micro Framework

[Demo] [Download]

Flap UI

An Open Source Component Library & Design System for HTML, Astro & React built on top of Tailwind CSS.

Flap UI

[Demo] [Download]

Color Magic

A fully typed JavaScript color manipulation library with zero dependency. You can generate, manipulate and access colors in popular color formats.

  • color construction from RGB, HSL, HEX, CSS named color and kelvin temperature
  • color conversions
  • color manipulations like rotating, lightening, darkening, saturating, desaturating, fading, brightening, negating, gray scaling, mixing, blending
  • color blending supports modes normal, multiply, screen, overlay, difference, exclusion, darken, lighten, dodge, burn, hard and soft
  • color query to RGB, HSL, HEX string and objects
  • get CSS color names from color
  • color information like luminance, contrast, level, is dark, is light, distance, temperature etc.
  • complementary, analogous, triadic, split complementary, double complementary of colors
  • color swatch generation (will be developed more)
  • any color string validation

Color Magic

[Download]

Hover3D.js

A cool 3D hover effect for your awesome web project.

Hover3D.js

[Demo] [Download]

3D-Cube-Resume

This repo contains a simple HTML/CSS/JS repo for showcasing my skills, experience, and achievements. This open-source resume has added features such as audio on image click, a mobile device unavailable message, and advanced encryption.

3D-Cube-Resume

[Demo] [Download]

TS I18n

ATypescript library that facilitates internationalization (i18n) in both browser and ES module environments (Node). It offers a lightweight solution for interpolation and pluralization.

Unlike some i18n libraries, ts-i18n doesn't handle the actual translation of phrases. Instead, it provides tools for managing translated phrases within your client or server-side Typescript application, making it agnostic to the translation backend used."

TS I18n

[Download]

SenCharts

An easy-to-use JavaScript library for creating interactive and fully customizable charts to visualize various data types (currently supports line charts and stock charts).

SenCharts

[Demo] [Download]

react-native-ruler-picker

Lightning-fast and customizable Ruler Picker component for React Native.

react-native-ruler-picker

[Download]

plotteus

A JavaScript library designed for better storytelling. Plotteus is a powerful tool that allows you to create interactive visualizations for your story from scratch, starting with defining a chart type, through seamless transitions between states, to giving you full control over them. Bet you'll fall in love at first chart?

plotteus

[Demo] [Download]

highlight-words

A lightweight and fast JavaScript library designed to highlight matched search queries in the text so users can quickly locate the information they’re seeking.

highlight-words

[Demo] [Download]

GameHive eSports Gaming Website

GameHive is a fully responsive esports gaming website. Responsive for all devices, build using HTML, CSS, and JavaScript.

GameHive eSports Gaming Website

[Download]

Add Button Interaction [SVG animation]

See the Pen Add Button Interaction [SVG animation] by Dusko Stamenic (@DuskoStamenic) on CodePen.

Hacked Text Effect

See the Pen Hacked Text Effect by Hyperplexed (@Hyperplexed) on CodePen.

Material - FAB (Expanding Button, CSS, Material Design System)

See the Pen Material - FAB (Expanding Button, CSS, Material Design System) by Kostantin Denerz (@konstantindenerz) on CodePen.

Cool hover effect using one element

See the Pen Cool hover effect using one element by Temani Afif (@t_afif) on CodePen.

Quantum Cosmic Textures

These cosmic textures will make you feel like you’re looking at all the mysterious planets out of the skyrocket.

Quantum Cosmic Textures

[Download]

RETRO WRITERS Free Grunge Display Font

RETRO WRITERS Free Grunge Display Font

[Download]