SmartHR Design System
  • さがす
  • コンセプト
  • 基本原則
  • 基本要素
  • アクセシビリティ
  • プロダクト
  • コミュニケーション

プロダクト

  • デザイン原則
  • デザイントークン
  • コンポーネント
  • コンテンツ
  • デザインパターン(共通)
  • デザインパターン(基本機能)
  • デザインの進め方
  • リソース
    • コンポーネント
  • React
    • Figma

      コンポーネント

      React

      ReactコンポーネントをGitHubに公開しています。
      https://github.com/kufu/smarthr-ui

      Storybookでカタログを確認できます。
      https://smarthr-ui.netlify.app/

      Figma

      Figma CommunityでSmartHR UIのコンポーネントを公開しています。
      https://www.figma.com/community/file/978607227374353992

      Figmaを使ってコンポーネントのUIデザインをする場合は、デザインデータ設計ガイドを参照してください。

      SmartHR Design System

      • さがす
      • ダウンロード一覧
      • 利用規約
      • お問い合わせ・フィードバック
      • 運用ガイドライン
      • 更新情報(Twitter)
      • 運営会社

      コンセプト

      • 利用方法
      • コンテンツ構成
      • 運営理念

      基本原則

      基本要素

      • ロゴ
      • 色
      • タイポグラフィ
      • アイコン
      • イラストレーション

      プロダクト

      • デザイン原則
      • デザイントークン
      • コンポーネント
      • コンテンツ
      • デザインパターン(共通)
      • デザインパターン(基本機能)
      • デザインの進め方
      • リソース

      コミュニケーション

      • 写真・動画
      • スライド・資料
      • 画面キャプチャ

      SmartHR© 2022, SmartHR, Inc.