Webui.io Playground

Basic

Button

Avatar

Input

Divider

Layout

Card

Grid

Flexbox

Project Overview

Manage your projects, track progress, and collaborate with your team in one unified workspace.

Properties

Component Type

Border Radius 12px

Shadow Intensity 10%

Padding 24px

Theme Color

Content

Card Title

Description

tsx

import { Card } from '@webui/core';

export default function Component() {
  return (
    <Card
      radius="12px"
      shadow="sm"
      padding="24px"
    >
      <h2>Project Overview</h2>
      <p>Manage your projects...</p>
      <Button>Get Started</Button>
    </Card>
  );
}
                