Vela UI Docs
venizia.ai

image-question

ImageQuestion, one of the 856 Vela UI icons, in the General group: a 24px grid drawn in currentColor, so it takes the colour of the text around it. It installs on its own as @velaui/icon-image-question.

  • 16px
  • 20px
  • 24px
  • 32px

Installation

pnpm dlx velaui add @velaui/icon-image-question

Usage

// components/icons/image-question.tsx
import ImageQuestion from "@/components/icons/image-question"

<ImageQuestion className="size-5 text-muted" />

In use

  • In a button

  • In a sentence

    Due Friday, or whenever the venue confirms.

  • In an input

  • As a badge

    Scheduled

  • In an empty state

    No events on this day yet.

    Browse blocks

Source

import * as React from "react";

export interface ImageQuestionProps extends React.SVGProps<SVGSVGElement> {
  size?: number | string;
}

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function ImageQuestion({ size = 24, strokeWidth = 1, className, ref, ...props }: ImageQuestionProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M6.375 21.125L15.9375 12.125L20.4375 16.625M6.375 21.125H17.625C19.489 21.125 21 19.614 21 17.75V11.5625M6.375 21.125C4.51104 21.125 3 19.614 3 17.75V6.5C3 4.63604 4.51104 3.125 6.375 3.125H12.5625M16.5 4.20113C16.5 2.98548 17.5074 2 18.75 2C19.9926 2 21 2.98548 21 4.20113C21 5.41679 19.9926 6.40227 18.75 6.40227M18.75 9.3971V9.3125M9.75 8.1875C9.75 9.11948 8.99448 9.875 8.0625 9.875C7.13052 9.875 6.375 9.11948 6.375 8.1875C6.375 7.25552 7.13052 6.5 8.0625 6.5C8.99448 6.5 9.75 7.25552 9.75 8.1875Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
ImageQuestion.displayName = "ImageQuestion";

export default ImageQuestion;