# 無料デザインツール

登録不要。アクセシビリティチェック、単位変換、カラーパレット生成にこれらのツールをお使いください。

---

### カテゴリー: カラー

1. **[Contrast Checker](/content/ja/tools/contrast-checker/index.html)**  
   Free WCAG 2.1 color contrast checker. Test your text and background colors against AA and AAA accessibility standards. Get contrast ratio and fix suggestions instantly.

2. **[Color Converter](/content/ja/tools/color-converter/index.html)**  
   Convert colors between HEX, RGB, HSL, and OKLCH. Generate complementary, analogous, and triadic palettes. Export as CSS variables or Tailwind config.

3. **[Gradient Generator](/content/ja/tools/gradient-generator/index.html)**  
   Free CSS gradient generator with live preview. Create beautiful linear, radial, and conic gradients visually. Adjust colors, stops, and angles, then copy production-ready CSS code instantly.

4. **[Color Info](/content/ja/tools/color-info/index.html)**  
   Look up any hex color code for detailed conversions (RGB, HSL, OKLCH), WCAG contrast ratios, shades, tints, and the closest CSS named color.

### カテゴリー: Lottie

1. **[Lottie Preview](/content/ja/tools/lottie-preview/index.html)**  
   Free online Lottie preview tool. Upload .json or .lottie files to view, test, and check animations. Inspect frame rate, dimensions, and duration. Works as a Lottie viewer, checker, tester, and JSON animation player.

2. **[Lottie to GIF](/content/ja/tools/lottie-to-gif/index.html)**  
   Convert Lottie JSON animations to GIF or WebM (VP9) right in your browser. Set resolution, frame rate, and quality — then download. No upload to servers, fully private.

3. **[Lottie to dotLottie](/content/ja/tools/lottie-to-dotlottie/index.html)**  
   Convert Lottie JSON files to the optimized dotLottie (.lottie) format. Smaller file size, same quality. Works entirely in your browser — no upload required.

### カテゴリー: CSS

1. **[Unit Converter](/content/ja/tools/css-unit-converter/index.html)**  
   Free CSS unit converter. Convert between px, rem, em, vw, vh, %, and pt with configurable base font size and viewport dimensions. Essential for responsive web design.

## 使う理由

### ポイント1のタイトル

ポイント1の説明

### ポイント2のタイトル

ポイント2の説明

### ポイント3のタイトル

ポイント3の説明

## お問い合わせ

[Chrome Web Store](https://chromewebstore.google.com/detail/miromiro/kpmkikjpclolhodgckeogmiiaehpfjhl)  
[機能](/content/ja/features/index.html)