学ぶ、考える、書き出す。

学習し、自分なりに噛み砕いて、書き出すブログ。

カラーコードを正規表現を使って判定する

カラーコードを判定するための正規表現を書きました。

^#([\da-fA-F]{6}|[\da-fA-F]{3})$

カラーコードの正規表現が合っているかどうかの検証に使った文字列は次の通りです。

// match
#339
#251
#aaa
#fff
#AAA
#cdf
#Abc3Fc
#F9012b
#afdcbf
#987345
// mismatch
#9af#f6f
339
621345
af89f8
#ggg
#fgf
#delcmi
#3r9
#-12345
#jjjjjj
#aaaaaaa
jkhfng
ff8iju

matchに挙げた文字列はカラーコードと判定されることを確認しています。またmismatchに挙げた文字列はカラーコードと判定されないことを確認してます。

正規表現の検証に使ったページ

regex101: build, test, and debug regex

参考にしたページ

記事を共有する

関連記事

  1. eslint-plugin-importによってVitestの設定ファイル上でエラーが発生する場合がある

    vitest と eslint-plugin-import に依存している環境では、vitest.config.ts内で vitest/config をインポートすると Unable to resolve path to module 'vitest/config'. eslint(import/no-unresolved) というエラーが出る場合があります。

  2. Next.js + Vercel + microCMSなどを使ってほぼ無料でブログを運用する

    当ブログのシステム構成について紹介します。構成を真似することでほぼ無料(後述)でブログを運営できます。

  3. ブログ記事を投稿するためのフォームを作った

    はてなブログのMarkdownによる記事編集画面やesa - 自律的なチームのための情報共有サービスのように、本文の編集画面とリアルタイムプレビューが横並びになるような投稿フォームが個人的に好みです。

  4. ファミリーマート公式Twitterのツイートからより良い画像の代替テキスト(alt)を考える

    ファミリーマートの公式Twitterのツイートに、画像の代替テキストを改善できそうなツイートがありました。