Skip to main content

All Questions

Tagged with
0 votes
1 answer
62 views

Next.js SVG Image Mask (Reusable component)

I've been trying all day to create a reusable Next.js SVG Image mask component, using only tailwind / inline styles for locally stored images. I want to be able to pass an svg into it and an image and ...
Michael Martell's user avatar
0 votes
0 answers
46 views

import SVG with CDATA inside in React Application

I'm currently building a simple weather application using react-library. The problem i'm facing is that the svgs that i'm using have <[!CDATA[]]> tag inside. So that when i do import svgExample ...
Ixtix's user avatar
  • 26
0 votes
0 answers
18 views

SVG Icon Taking Long to Reflect on Google

I have a Vite React app, and I've recently updated my favicon to an SVG file. However, it seems to be taking a long time for this change to be reflected on Google. Here are the details of my setup, I ...
Buvaneswaran V's user avatar
0 votes
1 answer
31 views

Adjust the SVG Path to achieve required design in my react app using tailwind CSS

Here is my running code so far: // DiscoveryResponse.jsx import { useState } from 'react'; import Heading from '../Heading/Heading'; import DiscoveryButton from '../DiscoveryButton/DiscoveryButton'; ...
Muhammad Omer Baig's user avatar
-1 votes
0 answers
28 views

React Icons Gi (game-icons) importing all library when importing any of them

Like a title says, if I import any icon from their library my component have additional ~5MB https://game-icons.net https://react-icons.github.io/react-icons/icons/gi/ Code here! | I can paste svg ...
Dawid Brzęczek's user avatar
0 votes
2 answers
65 views

How to set dark mode for SVG circle and it's properties

I am using tailwind css in one of my react application where i used one SVG tag for circular progress bar. In the page i used to set the dark theme, Where in click of theme icon page converts to black ...
Vicky's user avatar
  • 356
0 votes
2 answers
55 views

How can I prevent the second eye icon?

I had some preexisting code for a non-functional signup form, which already had an eye svg to it which would change the obstruction of the text within the password input box. However, upon adding some ...
SSFJHGKJFHG's user avatar
0 votes
0 answers
45 views

Why is getBBox() returning {x: 0, y: 0, width: 0, height: 0} for visible SVG elements in React?

Here's my SVG: <svg width="663" height="576" viewBox="0 0 663 576" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect id="misa" ...
kichan's user avatar
  • 11
0 votes
0 answers
26 views

Can't find the sgv id tag on canvas tag? [duplicate]

I try to pointing a dot on a svg file, but I can't find svg id tag in the code. import React, { useEffect, useRef } from "react"; import "./App.css"; import hillstateSvg from "...
kichan's user avatar
  • 11
-1 votes
1 answer
40 views

SVG Progress bar flickering and not showing the running progress

I am running one SVG Progress bar, Which code was present in Javascript and HTML and i converted this to the React js with tailwind css. After converting the code i found here is like after set the ...
Vicky's user avatar
  • 356
0 votes
1 answer
39 views

How to set color of svg dynamically in react

So I have created a react component that takes svg icons as a parameter. I want to switch the color of the SVG based on variant is active or not. Suggestions required for this purposes My React ...
hoor Iqbal's user avatar
0 votes
0 answers
27 views

Issue with Rendering Images in Canvas for Matching Game in React

I am working on a matching game in React where users need to connect items from two columns. The left column contains text items, and the right column contains images. However, I'm encountering an ...
Dhaneswar Setha's user avatar
0 votes
0 answers
28 views

Changing Color of FontAwesomeIcon's not working as intended?

Im trying to make a FontAwesomeIcon svg as a button, I am trying to change the color of the icon, but I am unsure why the color is not changing. I am using react and here is a portion of my code: ...
Ray Raiz's user avatar
0 votes
2 answers
56 views

Letter B in SVG logo not displaying correctly in React App [closed]

Logo converted from .png to .svg and opened the .svg file in VSCode to get the following SVG paths: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//...
jlimsy's user avatar
  • 3
0 votes
1 answer
62 views

Can't set className attribute for SVG component

During migration from webpack to vite I faced the following issue. I have the following React component: import { otherQuote as other__quote } from '@styles/pages/product/other/other.module.scss'; ...
Dima Kambalin's user avatar

15 30 50 per page